美文网首页
vue2 孙子组件修改父组件数组,父组件没有更新

vue2 孙子组件修改父组件数组,父组件没有更新

作者: 折叠幸福 | 来源:发表于2021-12-21 16:00 被阅读0次

1.问题
数据结构:数组-对象-数组-对象
父组件通过v-for渲染子组件,子组件通过v-for渲染孙子组件,孙子组件修改props里传过来的叶子数组元素,
父组件没有更新

期望:父组件更新

解决办法:
v-if 空值组件入口,然后孙子组件通过依赖注入调用父组件方法,父组件通过nexttick修改v-if绑定的值实现更新

相关代码,看不懂的评论区留言哈

 <!-- 组件入口 -->
    <div class="middle_wrap" v-if="eventlist.length > 0 && array_change">
      <div
        class="select_wrap"
        v-for="(item_1, index_1) in measures"
        :key="index_1"
      >
        <span class="left_num">{{ index_1 }}</span>
        <a-input
          class="select_title"
          placeholder="指标名称"
          v-model="item_1.name"
        />

        <level_1
          :eventlist="eventlist"
          :item_1="item_1"
          @level_change="level_change($event, index_1)"
          @close="level_close(index_1)"
        />
      </div>
    </div>

父组件修改

 test() {
      console.log(this.measures);

      this.array_change = false
      this.$nextTick( ()=>{
         this.array_change = true
      } )


    },

相关文章

网友评论

      本文标题:vue2 孙子组件修改父组件数组,父组件没有更新

      本文链接:https://www.haomeiwen.com/subject/lruxqrtx.html