码迷,mamicode.com
首页 > Web开发 > 详细

avalonJS中this使用的注意事项

时间:2017-07-11 11:51:14      阅读:228      评论:0      收藏:0      [点我收藏+]

标签:方法调用   his   highlight   方案   模型   注意事项   read   位置   func   

this指针一般是基于宿主环境而存在的一个变量,一般是指向宿主对象,而对于MVVM框架来说,一方面需要在VM中创建对自身对象的操作,同时也可以在V(view)中使用到VM中定义到的方法,以下代码帮助理解:

//JS 模型

var vm = avalon.define({

  $id:‘vmID‘,

  $getData: function(){

    console.log(this); // this指针的指向因着调用位置的不确定而不确定
  }

})

avalon.ready(function(){

  vm.$getData();

})

// DOM结构

<div ms-controller="vmID">

  <a href="javascript:void(0);" ms-click="$getData()">获取数据</a>

</div>

  这样一来,对于方法在VM模型中使用打印的便是VM对象,而对于在DOM节点中使用的模型对象方法调用时,打印的便是DOM节点对象,给予此在MVVM框架中使用this指针时务必要小心。

解决方案可以是,不要直接使用VM对象中的$getData()方法,而是重新定义一个方法:

//JS 模型

var vm = avalon.define({

  $id:‘vmID‘,

  $getData: function(){

    console.log(this);  //this指针的指向不确定
  },
  $jump: function(){
    console.log(this);  //this指针指向DOM节点对象
    vm.$getData();  //vm指向模型对象
  }

})

avalon.ready(function(){

  vm.$getData();

})

// DOM结构

<div ms-controller="vmID">

  <a href="javascript:void(0);" ms-click="$jump()">获取数据</a>

</div>

avalonJS中this使用的注意事项

标签:方法调用   his   highlight   方案   模型   注意事项   read   位置   func   

原文地址:http://www.cnblogs.com/zhang134you/p/7149756.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!