2个回答
展开全部
计算属性与响应式并不冲突对立的存在,计算属性往往是用于数据的聚合或者离散,数据响应式的话就是视图响应数据变动(先容我装个逼)
在vue中就是通过watcher调用一次实例对象中data的数据(当然这层数据也会做一层映射,映射到实例的属性中)在数据的defineObject中的getter方法中注册监听,每一次数据变动便触发setter调用注册的监听事件列表(这种调用不是实时的)监听调用完后vue开始构建虚拟dom并与之前的dom比较最终将数据变动渲染回页面上的真实dom,这是vue2.0,vue1.0的实现方式不太一样,不在此讨论
那计算属性是怎么做的,vue中的计算属性与js的计算属性是不一样的,vue中用户自己定义的计算属性函数其实是通过调用函数中使用的data中的数值来实现自动变化响应的,也就是在watcher调用了函数获取到返回值,然后在函数调用过程中使用了data中的属性并触发了这些属性getter借用这些getter中的事件注册为计算函数注册一个变化调用的事件回调。比较大的特点就是你在计算函数中不使用任何data中的属性的话计算函数其实是不会响应变动的。
ok,以上看不懂可以忽略,只是阐述一下vue的数据响应和计算属性的实现。对于响应数据与计算属性的使用这边举个栗子。
就以目前我们所做的云计算项目为例吧,云计算项目中容器服务会有空间与服务的概念一般后端的数据给的话容器对象中会包含一个空间名namespace,一个服务名称service,前端存储也会这样存后端返回的数据
在vue中就是通过watcher调用一次实例对象中data的数据(当然这层数据也会做一层映射,映射到实例的属性中)在数据的defineObject中的getter方法中注册监听,每一次数据变动便触发setter调用注册的监听事件列表(这种调用不是实时的)监听调用完后vue开始构建虚拟dom并与之前的dom比较最终将数据变动渲染回页面上的真实dom,这是vue2.0,vue1.0的实现方式不太一样,不在此讨论
那计算属性是怎么做的,vue中的计算属性与js的计算属性是不一样的,vue中用户自己定义的计算属性函数其实是通过调用函数中使用的data中的数值来实现自动变化响应的,也就是在watcher调用了函数获取到返回值,然后在函数调用过程中使用了data中的属性并触发了这些属性getter借用这些getter中的事件注册为计算函数注册一个变化调用的事件回调。比较大的特点就是你在计算函数中不使用任何data中的属性的话计算函数其实是不会响应变动的。
ok,以上看不懂可以忽略,只是阐述一下vue的数据响应和计算属性的实现。对于响应数据与计算属性的使用这边举个栗子。
就以目前我们所做的云计算项目为例吧,云计算项目中容器服务会有空间与服务的概念一般后端的数据给的话容器对象中会包含一个空间名namespace,一个服务名称service,前端存储也会这样存后端返回的数据
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询
广告 您可能关注的内容 |