vue prop属性传值与传引用示例
2019-12-11 12:11
996 查看
vue组件在prop里根据type决定传值还是传引用。
简要如下:
传值:String、Number、Boolean
传引用:Array、Object
若想将数组或对象类型也以值形式传递怎么办呢?如下方式可以实现:
// component-A 引用component-B组件 <component-B :person="personList" :personBak="person_Bak"> </component-B> // component-A 部分关键代码 // 将数组复制,personBak与personList是两个“内容”相同但地址不一样的对象(数组), // 这样可以变相的实现“传值”,person或personBak互不影响 person_Bak = JSON.parse(JSON.stringfy(this.personList)); //component-B props部分 props: { person: { type: Object, default: {} }, personBak: { type: Object, default: {} } }
以上这篇vue prop属性传值与传引用示例就是小编分享给大家的全部内容了,希望能给大家一个参考
您可能感兴趣的文章:
相关文章推荐
- Vue组件中prop属性使用说明实例代码详解
- JS中attr和prop属性的区别以及优先选择示例介绍
- HreoWinGauge2.0组件集应用示例----在应用程序中如何快速引用对象和属性
- Vue组件参数名命名与组件属性转化示例
- VUE 实现动态给对象增加属性,并触发视图更新操作示例
- Vue源码解析(一)data属性映射和methods函数引用的重定义
- Vue中计算属性computed的示例解读
- (一)快速上手VUE 基础 常用语法示例(html纯引用vue.js)
- Vue 使用Props属性实现父子组件的动态传值详解
- vue组件Prop传递数据的实现示例
- Vue中的属性传值
- Vue 使用Props属性实现父子组件的动态传值
- vue基于两个计算属性实现选中和全选功能示例
- VUE 父组件向子组件传值 (用属性传值)
- vue 中引用gojs绘制E-R图的方法示例
- vue组件通信传值操作示例
- vue计算属性get和set用法示例
- vue中的计算属性的使用和vue实例的方法示例
- block的属性传值和 block的方法传值 代码示例
- Vue Prop属性功能与用法实例详解