首页 > 移动平台 > 详细

uniapp-父组件数组变化同步子组件视图渲染

时间:2020-03-04 10:06:19      阅读:748      评论:0      收藏:0      [点我收藏+]

项目中子组件封装的是一个picker,父组件需要传数组到子组件中。

如果父组件的数组出现变更,视图中的子组件或许不能直接刷新渲染,需要反复弹起几下才能看到。

试过深度监听,但都没有用,ref也不知道为啥调不动,我这边使用子组件时外面还有个循环。

 

综上所述,解决方案如下:

1、添加一个变量isShowArr来判断是否显示该子组件

2、当数组变化后调用$nextTick方法来重新渲染子组件的内容

 

视图层:

        <view class="rt" v-if="agencyArr.length > 0 && isShowArr">
            <pk-select :arr="agencyArr[index]" :atIndex="agencyArr[index].indexOf(agencyArr[index].find(x => x.id == item.agency_id))" keyIndex="name" @change="changeSelect($event,index,4)"></pk-select>
        </view>

控制层:

        //当数组的值变更后
        _self.agencyArr = arr;
        _self.isShowArr = false;
        _self.$nextTick(() => {
            _self.isShowArr = true;
        })

 

uniapp-父组件数组变化同步子组件视图渲染

原文:https://www.cnblogs.com/nanyang520/p/12407778.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!