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. AWVS结果分析与实践-XSS

      今天趁着老师接项目,做了一丢丢实践,以下是一点点感触.     都知道AWVS是神器,可是到我手里就是不灵.拿了它扫了一个URL,结果提示XSS漏洞,实践没反应,只好愉快地享受了过程.来看看.   ...

  2. TDD - 登录成功和失败

    /** * Created by Administrator on 2017-04-06. */ @RunWith(SpringJUnit4ClassRunner.class)@SpringBootT ...

  3. MySQL的四种不同查询的分析

    1.前置条件: 本次是基于小数据量,且数据块在一个页中的最理想情况进行分析,可能无具体的实际意义,但是可以借鉴到各种复杂条件下,因为原理是相同的,知小见大,见微知著! 打开语句分析并确认是否已经打开 ...

  4. TZOJ 2018 SPF(连通图割点和分成的连通块)

    描述 Consider the two networks shown below. Assuming that data moves around these networks only betwee ...

  5. 5-Error:failed to find Build Tools revision 28.0.0 rc1解决方案

    将app下面的build.gradle中的版本改为你安装的 sdk 版本:

  6. sql:inner join,left join,right join,full join用法及区别

    join的语法: select [字段] from [表名1] inner/left/right/full join [表名2] on [表名1.字段1] <关系运算符> [表名2.字段2 ...

  7. vue vue-route 传参 $route.params

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  8. Fiddler抓包使用教程-安装配置

    转载请标明出处:http://blog.csdn.net/zhaoyanjun6/article/details/72876628 本文出自[赵彦军的博客] Fiddler是什么? Fiddler是一 ...

  9. Android.DebugOnDevices

    真机调试Android http://www.cnblogs.com/junqilian/archive/2012/11/08/2760734.html

  10. Invalid character found in the request target. The valid characters are defined in RFC 7230 and RFC 3986

    最近在Tomcat上配置一个项目,在点击一个按钮,下载一个文件的时候,老是会报上面的错误.试了很多方法,如对server.xml文件中,增加MaxHttpHeaderSize的大小,改端口,改Tomc ...