vue 学习 -- day39(reactive 对比 ref)

  • 从定义数据角度对比:
    • ref用来定义:基本类型数据
    • reactive用来定义:对象(或数组)类型数据
    • 备注:ref也可以用来定义对象(或数组)类型数据 , 它内部会自动通过reactive转为代理对象
  • 从原理角度对比:
    • ref通过Object.defineProperty()getset来实现响应式(数据劫持)。
    • reactive通过使用Proxy来实现响应式(数据劫持), 并通过Reflect 操作源对象内部的数据。
  • 从使用角度对比:
    • ref定义的数据:操作数据需要 .value,读取数据时模板中直接读取不需要 .value
    • reactive定义的数据:操作数据与读取数据:均不需要 .value

一般来说,会把组件里面用到的数据封装到对象里给 reactive 加工成响应式对象(代理对象),这样读取或修改的时候就不用 .value 了

相关推荐
Dread_lxy6 小时前
vue 依赖注入(Provide、Inject )和混入(mixins)
前端·javascript·vue.js
龙猫蓝图8 小时前
vue el-date-picker 日期选择器禁用失效问题
前端·javascript·vue.js
peachSoda78 小时前
随手记:简单实现纯前端文件导出(XLSX)
前端·javascript·vue.js
Tttian6228 小时前
Vue全栈开发旅游网项目(11)-用户管理前端接口联调
前端·vue.js·django
龙猫蓝图10 小时前
vue el-date-picker 日期选择 回显后成功后无法改变的解决办法
前端·javascript·vue.js
刘志辉10 小时前
Pure Adminrelease(水滴框架配置)
vue.js
工业互联网专业11 小时前
Python毕业设计选题:基于Django+uniapp的公司订餐系统小程序
vue.js·python·小程序·django·uni-app·源码·课程设计
黄景圣11 小时前
CURD低代码程序设计
前端·vue.js·后端
lin-lins11 小时前
Vue 模板编译原理
前端·javascript·vue.js
customer0812 小时前
【开源免费】基于SpringBoot+Vue.JS课程答疑系统(JAVA毕业设计)
java·jvm·vue.js·spring boot·spring cloud·kafka·开源