computed和watch的用法和区别
computed可以监听v-model(data)中的值,只要值发生变化 他就会重新去计算
computed必须是要有一个返回值的哦
<div id="app">
<input type="text" v-model="firstname">+
<input type="text" v-model="lasttname">=
<input type="text" v-model="fullname">
</div>
var vm = new Vue({
el: "#app",
data: {
firstname: "",
lasttname: "",
},
methods: { }, // computed可以监听v-model(data)中的值,只要值发生变化 他就会重新去计算
// computed必须是要有一个返回值的哦
computed: {
fullname: function () {
return this.firstname + "-" + this.lasttname
}
},
})
//watch除了可以监听data中值的变化,还可以监听路由的变化,
//watch中有两个参数 分别是新值和旧值
var vm = new Vue({
el: "#app",
data: { },
methods: { },
router: router,
watch: {
"$route.path":function(newval,oldval){
if(newval==="/login"){
console.log("这是denglu页面")
}else if(newval==="/zhuce"){
console.log("这是注册页面") }
}
}, })
computed和watch的区别
《1》计算属性computed 必须要返回一个值哦 通过return来返回的
《2》 watch的回调函数里面有两个参数,分别是newval和oldval。
computed和watch的用法和区别的更多相关文章
- set和enum类型的用法和区别
mysql中的set和enum类型的用法和区别 mysql中的enum和set其实都是string类型的而且只能在指定的集合里取值, 不同的是set可以取多个值,enum只能取一个值. 1 2 3 ...
- OC #import和@class的用法和区别
OC #import和@class的用法和区别 import会包含这个类的所有信息,包括实体变量和方法,而@class只是告诉编译器,其后面声明的名称是类的名称,至于这些类是如何定义的,暂时不用考虑, ...
- HashMap、HashTable、LinkedHashMap和TreeMap用法和区别
Java为数据结构中的映射定义了一个接口java.util.Map,它有四个实现类,分别是HashMap.HashTable.LinkedHashMap和TreeMap.本节实例主要介绍这4中实例的用 ...
- 脚本引用中的defer和async的用法和区别
之前的博客漫谈前端优化中的引用资源优化曾经提到过脚本引用异步设置defer.async,没有细说,这里展开一下,谈谈它们的作用和区别,先上张图来个针对没用过的小伙伴有个初始印象: 是的,就是在页面脚本 ...
- spring 后置处理器BeanFactoryPostProcessor和BeanPostProcessor的用法和区别
主要区别就是: BeanFactoryPostProcessor可以修改BEAN的配置信息而BeanPostProcessor不能,下面举个例子说明 BEAN类: package com.spring ...
- $.extend()和$.fn.extend()用法和区别
$.extend()和$.fn.extend()用法和区别: 在自己制作插件的时候会经常用到$.extend()和$.fn.extend()两个函数,无论从外观还是作用都非常的类似,但是实际上它们的区 ...
- kmalloc/kfree,vmalloc/vfree函数用法和区别
http://blog.csdn.net/tigerjibo/article/details/6412881 kmalloc/kfree,vmalloc/vfree函数用法和区别 1.kmalloc ...
- for,foreach,iterator的用法和区别
for,foreach,iterator的用法和区别 相同点: 三个都可以用来遍历数组和集合不同点:1.形式差别 for的形式是for(int i=0;i<arr.size();i++){. ...
- ASP.NET Application,Session,Cookie和ViewState等对象用法和区别 (转)
在ASP.NET中,有很多种保存信息的内置对象,如:Application,Session,Cookie,ViewState和Cache等.下面分别介绍它们的用法和区别. 方法 信息量大小 作用域和保 ...
随机推荐
- Oracle 双机热备+双机冷备+负载均衡
引用地址:https://wenku.baidu.com/view/7cca62f1ddccda38366baf7f.html SQL Server 2008 R2双机热备 引用地址:https:// ...
- vue高频面试题(面试路上踩过的坑)
### Vue 双向绑定原理 mvvm 双向绑定,采用**数据劫持结合发布者-订阅者模式**的方式,通过 `Object.defineProperty()` 来劫持各个属性的 setter.gette ...
- Selenium WebDriver 中鼠标事件(全)
Selenium WebDriver 中鼠标事件(全) 鼠标点击操作 鼠标点击事件有以下几种类型: 清单 1. 鼠标左键点击 Actions action = new Actions(driv ...
- ShiroUtil 对密码进行加密
ShiroUtil 对密码进行加密 package com.mozq.sb.shiro02.config; import org.apache.shiro.authc.SimpleAuthentica ...
- NN tutorials:
确实“人话”解释清楚了 ^_^ 池化不只有减少参数的作用,还可以: 不变性,更关注是否存在某些特征而不是特征具体的位置.可以看作加了一个很强的先验,让学到的特征要能容忍一些的变化.防止过拟合,提高模型 ...
- springboot集成freemarker属性配置(不知道是针对于某个版本,2.0后有变动)
freemarker属性配置 freemarker属性配置: spring.freemarker.allow-request-override=false # 设置是否允许HttpServletReq ...
- Object的多种方法
Object.entries() Object.entries() 方法返回一个给定对象自身可枚举属性的键值对数组,其排列与使用 for...in 循环遍历该对象时返回的顺序一致(区别在于 for-i ...
- 正睿暑期培训day3考试
链接 A 可以发现一个小棍的贡献是使得左右两列上的球位置互换.所以只要找出哪两个球会经过当前位置,然后swap一下就行了.. 考场上调了2.5h,依然没过样例.赛后发现忘了排序!!!!... /* * ...
- [NewLife.XCode]导入导出(实体对象百变魔君)
NewLife.XCode是一个有10多年历史的开源数据中间件,支持nfx/netcore,由新生命团队(2002~2019)开发完成并维护至今,以下简称XCode. 整个系列教程会大量结合示例代码和 ...
- matplotlib动态绘图
目录 package Process 解决中文乱码问题 simple_plot() scatter_plot() three_dimension_scatter() Jupyter notebook ...