VUX的安裝使用

VUX的安裝使用

1. npm i vux -S
2. 安裝 vux-loader npm i vux-loader -D
3. vux是使用的less 安裝less npm i less less-loader -D
4. 在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等號後面的全部內容

1. 在goodslist中引入 scroller

import { Scroller } from 'vux'

        export default {
            components: {
                Scroller
            }
        }

1. 在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>

1. 須要本身去添加浮動 來使標籤在一行上顯示

.box1 {
width: 750px;
.box1-item {

float: left;
span {
  display: block;
  width: 50px;
}

}
}