请选择 进入手机版 | 继续访问电脑版
 找回密码
 立即注册
搜索

互动交流 list组件能做左右滚动的效果吗

2
回复
98
查看
[复制链接]

5

主题

12

帖子

30

积分

 楼主| 2018-9-20 14:11:47 显示全部楼层 |阅读模式
我想用list实现tabs的效果,并且横向滚动,但是list的flex-direction样式设置为row后,列表的滚动以及子元素的排列方向并没有发生改变,求解;
回复

使用道具 举报

0

主题

5

帖子

25

积分

2018-9-20 15:59:33 显示全部楼层
<template>
    <list>
        <list-item for="arr">
            <div class="c1">
                <text>
                    {{$item.name}}

                </text>
            </div>

        </list-item>
    </list>

</template>
<style>
    list {
        border: 1px solid orange;
        flex-direction: row;
    }

    .c1 {
        border: 2px solid green;
        width: 100px;
        height: 200px;
    }
</style>
<script>

    let arr = [];
    let i = 0;
    while (i < 100) {
        i++;
        arr.push({
            name: '张s' + i
        })
    }

    export default {

        data() {
            return {
                arr
            }
        }
    }

</script>
回复

使用道具 举报

0

主题

17

帖子

85

积分

2018-9-21 09:39:04 显示全部楼层
在onInit里面执行arr增加元素的逻辑,感觉这样的arr取不到
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册