vue的computed属性要注意的两个地方,1,必须有return,2,使用属性不用括号

<div>
<input type="text" v-model="num1">
<p></p>
<input type="text" v-model="num2">
{{sum}} <input type="text" v-model="text">
{{getLength}}
</div>
<script>
export default {
name: "component_name",
data() {
return {
num1: 0,
num2: 0,
text: ""
};
},
// computed属性必须有return
computed: {
sum() {
this.num1 = parseInt(this.num1);
this.num2 = parseInt(this.num2);
return this.num1 + this.num2;
},
getLength() {
return this.text.length;
}
}
};
</script>

vue的computed属性的更多相关文章

  1. vue 的 computed 属性在什么时间执行

    vue 的 computed 属性在什么时间执行

  2. sau交流学习社区—vue总结:使用vue的computed属性实现监控变量变化,使用vue的watch属性监控变量变化从而实现其他业务

    有时候遇到这么个需求,输入框为空的时候,请求一遍接口,如果输入框不为空的时候,需要点击搜索按钮请求接口. 同步sau交流学习社区:https://www.mwcxs.top/page/464.html ...

  3. vue的computed属性的理解

    computed: { selectedQuestions() { let selectedQuestions = this.editedItem.questions; return this.que ...

  4. vue中,class、内联style绑定、computed属性

    1.绑定Class ①对象语法 <li :class="{ 'active': activeIdx==0 }" @click="fnClickTab(0)" ...

  5. vue中计算属性computed方法内传参

    vue中computed计算属性无法直接进行传参 如果有传参数的需求比如说做数据筛选功能可以使用闭包函数(也叫匿名函数)实现 例如: 在上篇博客vue安装使用最后的成绩表练习中的过滤功能的实现: &l ...

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

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

  7. 浅尝 Vue 中的 computed 属性 与 watch

    对于 computed 的理解: ①.computed 用来监控自己定义的变量,该变量不在 data 里面声明,直接在 computed里面定义,然后就可以在页面上进行双向数据绑定展示出结果或者用作其 ...

  8. Vue中的computed属性

    阅读Vue官网的过程中,对于计算属于与监听器章节的内容有点理解的不清晰:https://cn.vuejs.org/v2/guide/computed.html. 后来上网查询了资料,结合官网的说明,总 ...

  9. 八、Vue中的computed属性

    看了网上很多资料,对vue的computed讲解自己看的都不是很清晰,今天忙里抽闲,和同事们又闲聊起来,对computed这个属性才有了一个稍微比较清晰的认识,下面的文章有一部分是转自: https: ...

随机推荐

  1. java 操作zookeeper

    java 操作zookeeper(一) 首先要使用java操作zookeeper,zookeeper的javaclient 使我们更轻松的去对zookeeper进行各种操作,我们引入zookeeper ...

  2. 【python】理解循环:for,while

    先看下for结构: #!/usr/bin/python # -*- Coding:UTF-8 -*- for i in range(1): print i 输出: 0 输入和输出: #!/usr/bi ...

  3. sqlserver2017 +SSMS+ VS2017+SSDT 安装要点及相关组件下载地址

    1.sqlserver2017安装PolyBase需要安装jdk7 ,注意必须是7  jdk10是不行的. 下载地址:http://dl-t1.wmzhe.com/30/30117/jdk_7u_1. ...

  4. 民生银行十五年的数据体系建设,深入解读阿拉丁大数据生态圈、人人BI 是如何养成的?【转】

    早在今年的上半年我应邀参加了由 Smartbi 主办的一个小型数据分析交流活动,在活动现场第一次了解到了民生银行的阿拉丁项目.由于时间关系,嘉宾现场分享的内容非常有限.凭着多年对行业研究和对解决方案的 ...

  5. python中类变量和成员变量、局部变量总结

    class Member(): num= #类变量,可以直接用类调用,或用实例对象调用 def __init__(self,x,y): self.x=x #实例变量(成员变量),需要它是在类的构造函数 ...

  6. 设a、b、c均是0到9之间的数字,abc、bcc是两个三位数,且有:abc+bcc=532。求满足条件的所有a、b、c的值。

    题目描述 设a.b.c均是0到9之间的数字,abc.bcc是两个三位数,且有:abc+bcc=532.求满足条件的所有a.b.c的值. 输入描述: 题目没有任何输入. 输出描述: 请输出所有满足题目条 ...

  7. rviz2

    VINS-Mono ####Panels: 面板: - Class: rviz/Displays 显示1 Help Height: Name: Displays Property Tree Widge ...

  8. 关于document的节点;用Dom2创建节点;

    一.关于节点 1.节点树状图 document>documentElement>body>tagName 2.节点类型 元素节点(标签).文本节点(文本).属性节点(标签属性) 3. ...

  9. (转)关于X64位系统IIS7下支持32位asp.net程序

    最近在windows2008 x64位系统下的IIS7下部署asp.net程序. vs2005或vs2008默认的情况下是Any cpu 的也就是支持x86和x64两种系统的.可我的程序在引用了一个三 ...

  10. Android.InstallAntOnMacOSX

    在Mac OS X上安装ant http://blog.csdn.net/crazybigfish/article/details/18215439