1.el属性

用来指示vue编译器从什么地方开始解析 vue的语法,可以说是一个占位符。
相当于一个容器,跟上面的div id = "app"做关联,从此以后上面div id = "app"里面的内容要通过vue来渲染,都要经过vue处理才能看得到上面div里面的内容

2.data属性

用来组织从view中抽象出来的属性,可以说将视图的数据抽象出来存放在data中。
跟微信小程序一样,所有的变量都要写在data里面

3.template属性

用来设置模板,会替换页面元素,包括占位符。
Vue.component()组件中会用到,其实很多地方都会用到

4.methods属性

放置页面中的业务逻辑,js方法一般都放置在methods中,用来写方法,函数的
computed后面会介绍
computed和methods是有区别的:computed是在值发生改变的时候才会触发效果,而methods只要刷新执行了就会触发,所有平时写VUE的时候,能用computed的尽量使用

5.render属性

创建真正的Virtual Dom

6.computed属性

用来计算
根据已经存在的属性计算出新的属性,对于同样的数据,会缓存。当其依赖属性的值发生变化是,这个属性的值会自动更新,与之相关的DOM部份也会同步自动更新。其实一般情况,我也会把一些关于逻辑的代码都写在computed中。

7.watch侦听属性

watch:function(new,old){}
监听data中数据的变化
两个参数,一个返回新值,一个返回旧值
当你有一些数据需要随着其它数据变动而变动时或者执行异步操作或开销较大操作时,建议使用watch
computed和watch是有区别的:
watch: 监视,能够监听到数据的变化,只要数据变化的时候,都会自定执行对应的方法,其中可以检测的数据来源分为三部分 data , computed , props computed: 计算属性,存在一个计算缓存的特性,每一次计算之后,只要里面的逻辑不发生变化,每一次重复调用,都会使用上一次执行的结果,能够节省计算的时间

Logo

前往低代码交流专区

更多推荐