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;
}
}
}