直播系统app源码，vue实现简单瀑布流布局

直播系统app源码，vue实现简单瀑布流布局

npm 安装

 

npm install -s vue-stick

​

全局引用：

 

import Stick from 'vue-stick'
Vue.use(Stick);

 

 

在需要的页面中引用

 

<!-- html -->
          <Stick :list="caves" :columnWidth="columnWidth" :columnSpacing="columnSpacing">
            <template slot-scope="scope">
              <div >
<!-- 你需要展示的内容布局 -->
              </div>
            </template>
          </Stick>
//js
<script>
    export default {
        components: {
        },
        data() {
            return {
                columnWidth: '',
                columnSpacing: 10,
            }
        },
        created() {
            // 计算宽度
            this.columnWidth = (350 * 0.5 * (document.documentElement.clientWidth / 375))
        },
        mounted() {
        },
        methods: {
        }
    }
</script>

 

以上就是直播系统app源码，vue实现简单瀑布流布局， 更多内容欢迎关注之后的文章