写法一:

methods:{
//监听isMD
upProp(){
if(this.isMD){//如果isMD等于true 就把storeManagerName赋值给isStoreManagerName
this.isStoreManagerName='storeManagerName';
}else{
this.isStoreManagerName='';
}
}
},
watch:{
'isMD':'upProp'
}

写法二:

var vm = new Vue({
el:'#app' ,
data:{
name:''
}
}) //使用实例调用watch方法,这种是在实例外调用,而第一种是在实例里面调用,效果都是一样的
vm.$watch('name',()=>{
console.log("数据改变了");
})

Vue中使用watch来监听数据变化的更多相关文章

  1. React和Vue中,是如何监听变量变化的

    React 中事件监听 本地调试React代码的方法 先将React代码下载到本地,进入项目文件夹后yarn build 利用create-react-app创建一个自己的项目 把react源码和自己 ...

  2. vue.js之过滤器,自定义指令,自定义键盘信息以及监听数据变化

    一.监听数据变化 1.监听数据变化有两种,深度和浅度,形式如下: vm.$watch(name,fnCb); //浅度 vm.$watch(name,fnCb,{deep:true}); //深度监视 ...

  3. vue教程2-08 自定义键盘信息、监听数据变化vm.$watch

    vue教程2-08 自定义键盘信息 @keydown.up @keydown.enter @keydown.a/b/c.... 自定义键盘信息: Vue.directive('on').keyCode ...

  4. 关于微信小程序使用watch监听数据变化的方法

    众所周知,Vue中,可以使用监听属性 watch来观察和响应 Vue 实例上的数据变化,那么小程序能不能实现这一点呢? 监听器的原理,是将data中需监听的数据写在watch对象中,并给其提供一个方法 ...

  5. $watch监听数据变化和run方法

    angular中$watch方法可以监听数据的变化. $scope.$watch('phone',function(){ $scope.phone.fre = $scope.phone.num> ...

  6. $scope.$watch()——监听数据变化

    $scope.$watch(watchFn, watchAction, [deepWatch]):监听数据变化,三个参数 --watchFn:监听的对象,一个带有Angular 表达式或者函数的字符串 ...

  7. mvc 缓存 sqlCacheDependency 监听数据变化

    mvc 缓存   对于MVC有Control缓存和Action缓存. 一.Control缓存 Control缓存即是把缓存应用到整个Control上,该Control下的所有Action都会被缓存起来 ...

  8. vue中监听数据变化 watch

    今天做项目的时候,子组件中数据(原本固定的数据)需要父组件动态传入,如果一开始初始化用到的数据.但当时还没有获取到,初始化结束就不会更新数据了.只有监听这两个属性,再重新执行初始化. 1.watch是 ...

  9. vue中父组件如何监听子组件值的变化

    vue中我们会遇到很多父子组件通信的需求, 下面简单列一下,父子组件通信的几种情况 1:父组件向子组件传值:使用prop向子组件传值: 2:子组件实时监听父组件传来的值的变化:使用watch去监听父组 ...

随机推荐

  1. char类型

    1.JAVA中,char占2字节,16位.可在存放汉字 2.char赋值 char a='a';  //任意单个字符,加单引号. char a='中';//任意单个中文字,加单引号. char a=1 ...

  2. HBase thrift2 TIOError

    如果HBase thrift2报:"TIOError exception: Default TException", 这个可能是因为操作的表不存在,不一定是网络或磁盘操作异常. H ...

  3. Java的String类

    String类 String是引用数据类型:字符串是String类的对象 String类的构造方法 共有13种重载方式,这里只示例常用的几个 String():创建一个空字符串 String(Stri ...

  4. bootstrap1.1

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

  5. CSS 基础 例子 行高line-height

    “行高“指一行文字的高度,具体来说是指两行文子间基线间的距离.在CSS,line-height被用来控制行与行之间的垂直距离.line-height 属性会影响行框的布局.在应用到一个块级元素时,它定 ...

  6. NTP 服务器搭建

    FROM:http://blog.sina.com.cn/s/blog_511b46d10100agzf.html 配置环境: 1. 假设在 192.168.0.0 网段内,要以IP为 10.233. ...

  7. https://www.cnblogs.com/hnxxcxg/p/6085149.html

    DELPHI微信支付代码   不管是微信支付还是支付宝支付, 3个最棘手的问题是:1,如何生成签名2,支付请求如何提交3, 如何验证签名 下面就围绕这二个问题来讲. 我使用的是XE3. 先看微信支付: ...

  8. 分形之皇冠(Crown)

    皇冠分形曲线 核心代码: static void FractalCrown(const Vector3& vStart, const Vector3& vEnd, Vector3* p ...

  9. [leetcode 8] String to Integer

    1 题目: Implement atoi to convert a string to an integer. Hint: Carefully consider all possible input ...

  10. 三、Kubernetes之深入了解Pod

      1.yaml格式的Pod配置文件内容及注解 深入Pod之前,首先我们来了解下Pod的yaml整体文件内容及功能注解. 如下: # yaml格式的pod定义文件完整内容: apiVersion: v ...