vue的emit小技巧


1、在vue中正常来说父子组件传值一般用props属性单向传值,发现有更简洁的方式,就记录一下

2、原理:利用this.$emit("update:xx",value)和xx.sync

3、实现:

在父组件中

          <component
                    v-for="(item, index) in formItemList"
                    v-bind:is="item.formItemType + 'Dynamic'"
                    :key="index"
                    :formItemList="item"
                    :tabFormCode="tabFormCode"
                    :currentProductCode="currentProductCode"
                    :defaultValue="item.defaultValue || ''"
                    :inputValue.sync="item.inputValue"
                    :groups.sync="item.groups"
                    :ref="item.formItemType + 'Ref'"
                ></component>

在子组件中

setGroups() {
  this.$emit('update:groups', this.groupingArr) }

这样的写法不用在父组件中写调用方法,更简洁


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM