VUX的安装使用
- npm i vux -S
- 安装 vux-loader npm i vux-loader -D
- vux是使用的less 安装less npm i less less-loader -D
- 在build/webpack.base.conf.js中 添加配置
const vuxLoader = require('vux-loader') const webpackConfig = originalConfig // 原来的 module.exports 代码赋值给变量 webpackConfig module.exports = vuxLoader.merge(webpackConfig, { plugins: ['vux-ui'] }) originalConfig 就是原本webpack.base.conf.js中 module.exports等号后面的所有内容
- 在goodslist中引入 scroller
import { Scroller } from 'vux' export default { components: { Scroller } }
- 在template中添加html代码
<scroller lock-y :scrollbar-x=false> <div class="box1"> <div class="box1-item" v-for="i in 7"><span>{{' ' + i + ' '}}</span></div> </div> </scroller>
- 需要自己去添加浮动 来使标签在一行上显示
.box1 {
width: 750px;
.box1-item {
float: left;span { display: block; width: 50px;}
}
}