计算属性computed :计算属性computed定义起来像方法,用起来像普通属性一样,是在模板中绑定计算属性的,当data中对应数据发生改变时,计算属性的值也会发生改变。
Methods:methods是方法,只要调用它,函数就会执行。
相同:两者达到的效果是同样的。
不同:计算属性是基于它们的依赖进行缓存把数据存储到内存中,减少不必要的请求。只有相关依赖会发生改变时才会重新子组件的data赋值。只要相关依赖未改变,只会返回之前的结果,不再执行函数
<body>
<div id="box">
<!-- 计算属性computed定义起来像方法,用起来像属性 -->
<p>{ {mycomputed}}</p>
<p>{ {fun()}}</p>
<input type="text" v-model="msg"/>
<p>---------------------------------------</p>