1.计算属性是用来存储数据,但具有以下几个特点:
  a.数据可以进行逻辑处理操作。

  b.对计算属性中的数据进行监视。

2.计算属性和普通属性的区别:

  a.计算属性是基于它的依赖进行更新的,只有在相关依赖发生改变时才能更新变化

  b.计算属性是缓存的,只要相关依赖没有改变,多次访问计算属性得到的值是之前缓存计算的结果,不会多次执行。

3.get和set

  计算属性由两部分组成,get和set,分别用来获取计算属性和设置计算属性。

  默认只有get,如果需要set,要自己添加

<script type="text/javascript">
window.onload=function(){
let vm = new Vue({
el:"#app",
data:{
num:8
},
computed:{
num1:{
get:function(){//必须有返回值,用来获取属性,称为get函数
return this.num-1;
},
set:function(val){
console.log('修改num1的值');
this.num = 11;
}
}
},
methods:{
changeNum1:function(){
this.num1 = 11;
}
}
})
}
</script>

html:

<div id="app">
<p>{{ num }}</p>
<p>{{ num1 }}</p>
<button @click='changeNum1'>点击改变num1的值</button>
</div>

vue的计算属性get和set的更多相关文章

  1. vue的计算属性computed和监听器watch

    <template> <div> this is A.vue <br> <!--计算属性--> <label for="msg" ...

  2. Vue.js 计算属性是什么

    Vue.js 计算属性是什么 一.总结 一句话总结: 模板 表达式 维护 在模板中表达式非常便利,但是它们实际上只用于简单的操作.模板是为了描述视图的结构.在模板中放入太多的逻辑会让模板过重且难以维护 ...

  3. vue的计算属性

    在模板中写入过多的逻辑使模板过重且难以维护.因此有了计算属性(computed)的产生. 你可以像绑定普通属性一样在模板中绑定计算属性,vue知道计算属性中的函数依赖data中的数据.所以当data中 ...

  4. Vue.js 计算属性(computed)

    Vue.js 计算属性(computed) 如果在模板中使用一些复杂的表达式,会让模板显得过于繁重,且后期难以维护.对此,vue.js 提供了计算属性(computed),你可以把这些复杂的表达式写到 ...

  5. 一起学Vue之计算属性和侦听器

    概述 在Vue开发中,模板内的表达式非常便利,但是设计它们的初衷是用于简单运算的.在模板中放入太多的逻辑会让模板过重且难以维护.当你想要在模板中多次引用相同表达式时,就会更加难以处理.所以,对于任何复 ...

  6. vue中计算属性的get与set方法

    计算属性get set方法 在vue的计算属性中,所定义的都是属性,可以直接调用 正常情况下,计算属性中的每一个属性对应的都是一个对象,对象中包括了set方法与get方法 computed:{ ful ...

  7. Vue.js 计算属性

    Vue.js 计算属性 使用计算属性的实例: <!DOCTYPE html> <html> <head> <meta cahrset="utf-8& ...

  8. 浅谈Vue中计算属性(computed)和方法(methods)的差别

    浅谈Vue中计算属性(computed)和方法(methods)的差别 源码地址 methods方法和computed计算属性,两种方式的最终结果确实是完全相同 计算属性是基于它们的响应式依赖进行缓存 ...

  9. Vue之计算属性

    上一篇里演示了计算属性的优点,但是,computed和data里的属性还是有区别的,computed的一个弱点就在于依赖于data属性的更新,才能触发视图更新. 举个例子: 上个例子中谈到用v-for ...

  10. Vue.js 计算属性的秘密

    计算属性是一个很邪门的东西,只要在它的函数里引用了 data 中的某个属性,当这个属性发生变化时,函数仿佛可以嗅探到这个变化,并自动重新执行. 上述代码会源源不断的打印出 b 的值.如果希望 a 依赖 ...

随机推荐

  1. android 集成支付宝app支付(原生态)-包括android前端与java后台

    本文讲解了 android开发的原生态app集成了支付宝支付, 还提供了java后台服务器处理支付宝支付的加密代码, app前端与java后台服务器使用json数据格式交互信息,java后台服务主要用 ...

  2. nutch的定时增量爬取

    译文来着: http://wiki.apache.org/nutch/Crawl 介绍(Introduction) 注意:脚本中没有直接使用Nutch的爬去命令(bin/nutch crawl或者是& ...

  3. Android 最新面试题

    1. Intent的几种有关Activity启动的方式有哪些,你了解每一个含义吗? Intent的一些标记有FLAG_ACTIVITY_BROUGHT_TO_FRONT .FLAG_ACTIVITY_ ...

  4. [GraphQL] Apollo React Mutation Component

    In this lesson I refactor a React component that utilizes a higher-order component for mutations to ...

  5. WindowsclientC/C++编程规范“建议”——函数

    1 函数 1.1 代码行数控制在80行及以内 等级:[要求] 说明:每一个函数的代码行数控制应该控制在80行以内.假设超过这个限制函数内部逻辑一般能够拆分.假设试图超过这个标准.请列出理由. 但理由不 ...

  6. 【FastDev4Android框架开发】打造QQ6.X最新版本号側滑界面效果(三十八)

    转载请标明出处: http://blog.csdn.net/developer_jiangqq/article/details/50253925 本文出自:[江清清的博客] (一).前言: [好消息] ...

  7. 关于JOS 未对全部内存分页映射之前 物理地址映射问题的思考

    在kern/pmap.c 里面会又以下这段代码,要知道boot_alloc只会分配线性地址,真正建立虚拟页和物理页映射关系的在后面的page_alloc. ////////////////////// ...

  8. Problem G 宝石合成 (内蒙古14年省赛)

    1117: Problem G 宝石合成 时间限制: 1 Sec  内存限制: 128 MB 提交: 18  解决: 4 [提交][状态][讨论版] 题目描写叙述 故事人物:豆豆强 走上致富之路的豆豆 ...

  9. iOS 获取当前时间格式化字符串

    iOS 获取当前时间格式化字符串 太阳火神的漂亮人生 (http://blog.csdn.net/opengl_es) 本文遵循"署名-非商业用途-保持一致"创作公用协议 转载请保 ...

  10. VC++玩转Native Wifi API 2---Wifi on与wifi off

     有心栽花花不开,无心插柳柳成排. 今天要说的这个wifi on\off是在软件层面控制无线网卡的开和关. 问题听起来简单,调查起来复杂.但解决起来却也简单.关键函数便是Native wifi a ...