HTML正文：

<body ms-controller="ex">

<div  class="ms-hover" ms-click="change('array')">

<div ms-repeat="array">{{el}}</div>

</div>

</body>

　　

Javascript操作代码：

//对象数组子元素的监听

var vm=avalon.define({

    $id:"ex",

    aaa:{bbb:{ccc:1}},

    array:[1,2],

    change:function(aaa){

        vm[aaa].push(new Date-1);

    }

});

//监听子孙元素只需在该元素的父元素上监听将子元素看作是父元素的一个属性

vm.aaa.bbb.$watch("ccc",function(a,b){

    avalon.log(a,b);

});

setTimeout(function(){

    vm.aaa.bbb.ccc=new Date-0;

}, 2000);

//watch:监听array的属性length的值：数组只能监听到数组长度

vm.array.$watch("length",function(a,b){

    avalon.log("length:"+a+"--"+b);

});

　　

avalon子孙元素属性监听的更多相关文章

  1. 迷你MVVM框架 avalonjs 学习教程15、属性监听与模块通信

    avalon的ViewModel对象从其内部EventManager里继承了三个方法,$watch.$unwatch.$fire三个方法,它们就是我们本节的主题. 词如其名,非常直白,一看就知道做什么 ...

  2. 微信小程序实现watch属性监听数据变化

    Vue 提供了一种通用的方式来观察和响应 Vue 实例上的数据变动:监听属性 watch. 虽然watch的滥用会导致性能不佳,但在一些情况下我们还是需要watch,使得代码更加简洁.逻辑更加清晰(其 ...

  3. vue对象属性监听

    对象属性监听的两种方法: 1.普通的watch data() { return { frontPoints: 0 } }, watch: { frontPoints(newValue, oldValu ...

  4. jquery对append进的元素的监听操作

    通常append是再页面加载完之后才加入进去的,此时使用click方法是没有效果的,应使用document.on来实现对元素的监听. 例: $(document).on("click&quo ...

  5. Vue 变量，成员，属性监听

    Vue变量 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF ...

  6. Vue之计算属性Computed和属性监听Watch，Computed和Watch的区别

    一. 计算属性(computed) 1.计算属性是为了模板中的表达式简洁,易维护,符合用于简单运算的设计初衷. 例如: <div id="app"> {{ myname ...

  7. Vue.js之计算属性（computed）、属性监听（watch）与方法选项（methods）

    vue.js官网:https://cn.vuejs.org/v2/guide/components-registration.html 一.计算属性-computed 1. 作用:能够避免数据冗余,通 ...

  8. vue2.x版本中Object.defineProperty对象属性监听和关联

    前言 在vue2.x版本官方文档中 深入响应式原理 https://cn.vuejs.org/v2/guide/reactivity.html一文的解释当中,Object.defineProperty ...

  9. ResizeObserver - 元素resize监听API

    Motivation 响应式网站/Web应用程序 根据视口大小调整内容展示方式.这通常通过CSS和media查询来完成.当CSS表现不好我们会使用Javascript. 比如document.addE ...

随机推荐

  1. jquery Load方法的重要点

    一个非常重要而且很容易忽视的问题就是:你是否load进了你必须load的元素,是否有的没有load进来,打开firebug查看一下

  2. 关于openwrt使用web升级提示固件版本不对的处理方法

    参考资料:https://blog.csdn.net/caoshunxin01/article/details/79355602 当openwrt使用web升级提示固件版本不对: The upload ...

  3. spark pyspark 常用算法实现

    利用Spark-mllab进行聚类,分类,回归分析的代码实现(python) http://www.cnblogs.com/adienhsuan/p/5654481.html 稀疏向量: 关于Spar ...

  4. python3进行汉字和unicode码的转换

    输出某个unicode码对应的汉字和某个汉字对应的unicode编码. # -*- coding=UTF-8 -*- str1 = "\u6000"#某个汉字的unicode码 s ...

  5. Layout两列定宽中间自适应三列布局

    最容易理解的一种方法,以中间内容为主体,通过 margin 或者 padding 将两侧撑开,最后用 absolute 定位两侧 html: <div class="container ...

  6. linux系统上项目部署

    步骤:(特别注意:虚拟机安装的一般是32位的操作系统,jdk也必须使用32位的)查看虚拟机版本:sudo uname --m i686 //表示是32位 x86_64 // 表示是64位 查看是否已经 ...

  7. Gradle安装和在IDEA使用 基本操作

    阅读目录 简单介绍 安装 使用idea创建一个web的Gradle项目 如何进行打包 解释build.gradle和settings.gradle 有关gradle的jar冲突 本地jar包位置和修改 ...

  8. Light Probe Proxy Volume

    [Light Probe Proxy Volume] The Light Probe Proxy Volume (LPPV) component allows you to use more ligh ...

  9. JMeter学习（五）集合点（转载）

    转载自 http://www.cnblogs.com/yangxia-test JMeter也有像LR中的集合点,本篇就来介绍下JMeter的集合点如何去实现. JMeter里面的集合点通过添加定时器 ...

  10. Linux 学习总结（二）

    一.用户与用户组管理 1.添加用户 useradd 选项 用户名 -c 指定一段注释性描述 -d 目录,指定用户目录,若目录不存在,-m 选项可以创建目录 -g 指定用户所属用户组 -s 指定用户登陆 ...