weex-使用Vue.set设置属性和使用this.xxx设置属性的区别
在使用weex过程中,免不了要自定义组件,或者说封装子控件,这时候需要把父组件的一些值传递到子控件中并作出相应的操作,这时候就要使用props来进行传值,但是在赋值的时候,具体通过Vue.set来修改属性还是通过this.xxxx来修改是一个问题,不熟悉的人很容易被困扰到,下面博主将详细讲解下这两种赋值的使用方法和条件:
1.Vue.set
此截图来自于vue官网,从这里可以看到vue.set的使用方法和参数特质,限制比较严格,之所以用vue.set是为了避开vue不能检测属性被添加的限制,简而言之就是,vue本身不能动态添加属性,添加一个不存在的属性,但是通过vue.set你可以这么干,这三个参数分别代表:
json对象(字典)/数组-------键值/数组中的index-------你要设置的新值
一定要注意,target只能是两种格式,一种是字典,或者说json对象,另一种是数组,切记!!!
2.this.xxx
什么情况下用到这个呢?这也是用来改变属性的一种设置方法它和Vue.set的区别是:
Vue 不允许在已经创建的实例上动态添加新的根级响应式属性(root-level reactive property)。但是它可以使用 Vue.set(object, key, value) 方法将响应属性添加到嵌套的对象上,这里this.xxxxx是针对没有嵌套的对象 所以不用vue.set反而更好,否则你的对象会被强制转为数组类型,博主已经体验过了,很不方便。
Vue 不允许在已经创建的实例上动态添加新的根级响应式属性(root-level reactive property)。但是它可以使用 Vue.set(object, key, value) 方法将响应属性添加到嵌套的对象上,这里this.content没有嵌套了 所以不用vue.set也可以的,或者说不用反而更好。
华丽丽的分割线
在此总结,如果传递的类型是string,Nsnumber,布尔,这样的类型是没有嵌套的,没有层级,只是一个变量,那就直接用this.xxxx来设置值,否则就需要上面的Vue.set来设置了。
博主下一篇博客,将会详细讲解怎么来设置属性,用实例给大家讲述,一步步教你学会自定义控件,并传值。
相关文章
- vue :src 不显示的解决方案
- vue blob流下载zip文件
- Vue循环中v-for和of,in
- [Vue @Component] Simplify Vue Components with vue-class-component
- [Vue-rx] Disable Buttons While Data is Loading with RxJS and Vue.js
- [Vue + TS] Create Type-Safe Vue Directives in TypeScript
- vue计算属性:computed示例
- vue事件修饰符:v-once只执行一次
- Vue入门教程:node安装vue命令行工具及启动项目
- 使用Vue封装过组件吗?有哪些?讲一下他们是怎么实现的
- Vue CLI 4.x安装成功,但是无法运行vue-V等指令。报错vue -V 不是内部或外部命令,也不是可运行的程序或批处理文件解决方案!!!
- vue读书笔记开发环境搭建
- vue快速学习01、环境与常用属性标签
- 你知道,什么时候用Vue计算属性吗?
- Vue+Element ui上传图片限制图片尺寸
- Vue学习之--------脚手架的分析、Ref属性、Props配置(2022/7/28)
- Springboot+Vue实现将图片和表单一起提交到后端,同时将图片地址保存到数据库、再次将存储的图片展示到前端vue页面
- Vue中vue-i18n结合vant-ui实现国际化
- Vue、Vuejs从入门到精通 | vue-router详解
- 230:vue+openlayers使用WebGLPoints显示数据,根据某属性值的不同阈值显示不同颜色点
- 203:vue+openlayers 地图旋转移动动画、CSS缩放动画,介绍animate的使用方法
- 201:vue+openlayers:加载geojson文件形成围栏,可添加、修改、删除feature,导出geojson
- 157:vue+openlayers 地图上添加Echarts饼图
- 138:vue+openlayers 绘制矩形,截取对应部分的地图并保存
- vue---进行post和get请求
- Vue(一)vue 概述与用法、MVVM、绑定语法、vue 指令
- vue实现倒计时60秒