l***@qq.com
l***@qq.com
  • 发布:2018-09-20 09:02
  • 更新:2018-10-31 15:03
  • 阅读:3890

uni-drawer 怎么样动态添加里面的内容。

分类:uni-app

<uni-drawer :visible="leftDrawerVisible" mode="left" @close="closeLeftDrawer" class="left-drawer">
<view class="drawer-content">
<view class="uni-list">
<block v-for="(pingsVal,pingsIndex) in pings" :key="pingsIndex">
<view class="uni-list-cell" hover-class="uni-list-cell-hover">
<view class="uni-list-cell-navigate uni-navigate-right">
{{pingsVal.pingName}}
</view>
</view>
</block>
</view>
</view>
</uni-drawer>

uni-drawer 组件,里面使用了v-for, 无法输出内容。

2018-09-20 09:02 负责人:无 分享
已邀请:
Rubik

Rubik

你要通过组件的props把数据传给组件,再在组件内遍历输出。

组件内:

props: {  
            /**  
             * 显示状态  
             */  
            visible: {  
                type: Boolean,  
                default: false  
            },  
            /**  
             * 显示模式(左、右),只在初始化生效  
             */  
            mode: String,  
            /**  
             * 蒙层显示状态  
             */  
            mask: {  
                type: [Boolean, String],  
                default: true  
            },  
            vehList: Array  
        },

组件引用:

<uni-drawer :visible="rightDrawerVisible" mode="right" @close="closeRightDrawer" :vehList="vehList">  
            <view class="drawer-content bg-color-right">  
                <text>车辆列表:</text>  
                <view class="uni-list bg-color-right">  
                    <block v-for="(item,index) in vehList" :key="index">  
                        <view class="uni-list-cell" hover-class="vehlist-cover">  
                            <view class="uni-list-cell-navigate" @tap="moveToVeh(index)">  
                                <text class="vid-item">编号: {{item.vid}}</text>  
                            </view>  
                            <view class="uni-icon uni-icon-locked" @tap="unlock(item.vid)"></view>  
                        </view>  
                    </block>  
                </view>  
            </view>  
        </uni-drawer>
DCloud_UNI_GSQ

DCloud_UNI_GSQ

1.0.0.20181010版本修复此问题。

  • 1***@qq.com

    1.7.020190314版本还是有这个问题呢

    2019-03-27 18:55

该问题目前已经被锁定, 无法添加新回复