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的用法和区别的更多相关文章

  1. set和enum类型的用法和区别

    mysql中的set和enum类型的用法和区别 mysql中的enum和set其实都是string类型的而且只能在指定的集合里取值, 不同的是set可以取多个值,enum只能取一个值.   1 2 3 ...

  2. OC #import和@class的用法和区别

    OC #import和@class的用法和区别 import会包含这个类的所有信息,包括实体变量和方法,而@class只是告诉编译器,其后面声明的名称是类的名称,至于这些类是如何定义的,暂时不用考虑, ...

  3. HashMap、HashTable、LinkedHashMap和TreeMap用法和区别

    Java为数据结构中的映射定义了一个接口java.util.Map,它有四个实现类,分别是HashMap.HashTable.LinkedHashMap和TreeMap.本节实例主要介绍这4中实例的用 ...

  4. 脚本引用中的defer和async的用法和区别

    之前的博客漫谈前端优化中的引用资源优化曾经提到过脚本引用异步设置defer.async,没有细说,这里展开一下,谈谈它们的作用和区别,先上张图来个针对没用过的小伙伴有个初始印象: 是的,就是在页面脚本 ...

  5. spring 后置处理器BeanFactoryPostProcessor和BeanPostProcessor的用法和区别

    主要区别就是: BeanFactoryPostProcessor可以修改BEAN的配置信息而BeanPostProcessor不能,下面举个例子说明 BEAN类: package com.spring ...

  6. $.extend()和$.fn.extend()用法和区别

    $.extend()和$.fn.extend()用法和区别: 在自己制作插件的时候会经常用到$.extend()和$.fn.extend()两个函数,无论从外观还是作用都非常的类似,但是实际上它们的区 ...

  7. kmalloc/kfree,vmalloc/vfree函数用法和区别

    http://blog.csdn.net/tigerjibo/article/details/6412881 kmalloc/kfree,vmalloc/vfree函数用法和区别 1.kmalloc ...

  8. for,foreach,iterator的用法和区别

    for,foreach,iterator的用法和区别 相同点:   三个都可以用来遍历数组和集合不同点:1.形式差别 for的形式是for(int i=0;i<arr.size();i++){. ...

  9. ASP.NET Application,Session,Cookie和ViewState等对象用法和区别 (转)

    在ASP.NET中,有很多种保存信息的内置对象,如:Application,Session,Cookie,ViewState和Cache等.下面分别介绍它们的用法和区别. 方法 信息量大小 作用域和保 ...

随机推荐

  1. 10.Java基础_IDEA的使用

    IDEA下项目结构: 项目->模块->包->java文件 流程图 1.创建一个空项目(JavaSE_Code) 选择Empty Project 输入项目名和路径 2.创建一个新模块 ...

  2. 树型DP(2)

    声明 https://blog.csdn.net/no1_terminator/article/details/77824790 参考课件和讲授来自Accelerator 找树的直径 树的直径定义为一 ...

  3. Xshell使用教程

    Xshell 是一个强大的安全终端模拟软件,它支持SSH1, SSH2, 以及Microsoft Windows 平台的TELNET 协议.Xshell 通过互联网到远程主机的安全连接以及它创新性的设 ...

  4. Maven中使用tomcat:run出现错误org.eclipse.jdt.internal.compiler.classfmt.ClassFormatException

    配置是正常的.查阅资料以后说是jdk版本什么的问题.多方修改没有任何改观.换一个思路去查询tomcat:run怎么运行. 是因为他还是沿用了上一次的tomcat插件(默认是6)所以运行的时候使用 to ...

  5. CF1225B2 TV Subscriptions (Hard Version)

    CF1225B2 TV Subscriptions (Hard Version) 洛谷评测传送门 题目描述 The only difference between easy and hard vers ...

  6. 群体遗传之ped格式

    1.PED简介 PED文件格式是广泛使用的用于连锁系谱数据分析的格式,并用作plink程序的输入.PLINK是一个免费的,开源的全基因组关联分析工集,旨在以高计算效率的方式执行一系列基本的,大规模的分 ...

  7. ActiveMQ基础使用

    概述 ActiveMQ是由Apache出品的,一款最流行的,能力强劲的开源消息总线.ActiveMQ是一个完全支持JMS1.1和J2EE 1.4规范的 JMS Provider实现,它非常快速,支持多 ...

  8. JavaScript对象及初识面向对象

    一.对象 1.1对象是什么 对象是包含相关属性和方法的集合体 1.2什么是面向对象 面向对象仅仅是一个概念或者编程思想 通过一种叫做原型的方式来实现面向对象编程 二.创建对象 2.1自定义对象 2.1 ...

  9. pixijs shader贴图扫光效果

    pixijs shader贴图扫光效果 直接贴代码 const app = new PIXI.Application({ transparent: true }); document.body.app ...

  10. Vue 结合 SignalR 实现前后端实时消息同步

    最近业务中需要实现服务器端与客户端的实时通信功能,对Signalr做了一点总结和整理. SignalR 作为  ASP.NET 的一个库,能够简单方便地为应用提供实时的服务器端与客户端双向通信功能. ...