Backbone中View之间传值的学习心得


Posted in Javascript onAugust 09, 2016

Backbone中的View就是用来展示由Model层传出的数据,或者在View里产生的一些数据,包括输入框中输入等产生的数据,由当前View传递到另外一个View层里,应该怎么办呢,我之前读到一位博主《Backbone View的三种通信方式 》写的尤为的清晰,在我实际的项目中,常常使用的也就是最后一种方式。

嘿嘿,分享知识是一件快乐的事情,我就直接借鉴表述一下如下:

直接用 Backbone 作为事件注册机,

Backbone中View之间传值的学习心得

代码如下:

var ApplicationView = Backbone.View.extend({
initialize : function(){
this.documentView = new DocumentView();
this.sidebarView = new SidebarView();
},
});
var DocumentView = Backbone.View.extend({
onEdit : function(){
Backbone.trigger('documentEdit');
}
});
var SidebarView = Backbone.View.extend({
initialize : function(options){
Backbone.on('documentEdit', this.onDocumentEdit, this);
},
onDocumentEdit : function(){
// react to document edit.
}
});

使用Backbone 时间注册机方法,不仅仅能够实现同一个父级View下不同的子级View之间的信息传递,并且还能够实现不同父级View下各个子级View的信息传递,我当时刚接触的时候感觉这个方法特别的好使,但是后来又出现了两个我有点困惑的地方,我也一并分享下。

第一个就是当我们由父级View向子级View传递信息或者数据的情况,用事件注册应该也是可以的,但是在项目中,我采用的是在初始化视图的时候,将父级View中的要传递的信息分配个子View,这样视图render出之后,就已经有了父级View给予它的数据。就如这样:

Backbone中View之间传值的学习心得

this.receive是由父级View已经包装好的,在初始化子View时候就把this.receive下发就好了。

第二种情况就是同一个子级View之间的传递,这种情况可能大家都懂的,我还是解释一下吧,就是在一个子级View里面定义一个针对这一个View的全局变量,然后通过this引用这个变量就Ok。

以上所述是小编给大家介绍的Backbone中View之间传值的学习心得,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
仿迅雷焦点广告效果(JQuery版)
Nov 19 Javascript
一个简单的js渐显(fadeIn)渐隐(fadeOut)类
Jun 19 Javascript
jQuery数组处理方法汇总
Jun 20 Javascript
js String对象中常用方法小结(字符串操作)
Jan 27 Javascript
jQuery通过扩展实现抖动效果的方法
Mar 11 Javascript
js实现当复选框选择匿名登录时隐藏登录框效果
Aug 14 Javascript
jquery实现图片切换代码
Oct 13 Javascript
js判断文件类型大小并给出提示的实现方法
Jan 03 Javascript
vuejs项目打包之后的首屏加载优化及打包之后出现的问题
Apr 01 Javascript
解决vue中虚拟dom,无法实时更新的问题
Sep 15 Javascript
js实现时分秒倒计时
Dec 03 Javascript
Javascript模拟实现new原理解析
Mar 03 Javascript
全面了解函数声明与函数表达式、变量提升
Aug 09 #Javascript
jQuery 生成svg矢量二维码
Aug 09 #Javascript
浅谈JavaScript中变量和函数声明的提升
Aug 09 #Javascript
浅谈js基本数据类型和typeof
Aug 09 #Javascript
js中判断变量类型函数typeof的用法总结
Aug 09 #Javascript
详解js实现线段交点的三种算法
Aug 09 #Javascript
完美解决jQuery符号$与其他javascript 库、框架冲突的问题
Aug 09 #Javascript
You might like
全国FM电台频率大全 - 23 四川省
2020/03/11 无线电
下拉列表多级联动dropDownList示例代码
2013/06/27 PHP
php使用PDO方法详解
2014/12/27 PHP
2款PHP无限级分类实例代码
2015/11/11 PHP
php+redis实现注册、删除、编辑、分页、登录、关注等功能示例
2017/02/15 PHP
PHP获取路径和目录的方法总结【必看篇】
2017/03/04 PHP
php基于数组函数实现关联表的编辑操作示例
2017/07/04 PHP
thinkPHP框架实现多表查询的方法
2018/06/14 PHP
一个js拖拽的效果类和dom-drag.js浅析
2010/07/17 Javascript
通过Javascript将数据导出到外部Excel文档的函数代码
2012/06/15 Javascript
浅析js设置控件的readonly与enabled属性问题
2013/12/25 Javascript
JavaScript使用ActiveXObject访问Access和SQL Server数据库
2015/04/02 Javascript
JavaScript声明变量名的语法规则
2015/07/10 Javascript
JavaScript 随机验证码的生成实例代码
2016/09/22 Javascript
BootStrap Fileinput的使用教程
2016/12/30 Javascript
JavaScript中在光标处插入添加文本标签节点的详细方法
2017/03/22 Javascript
实例学习JavaScript读取和写入cookie
2018/01/29 Javascript
微信小程序通过保存图片分享到朋友圈功能
2018/05/24 Javascript
从零开始在NPM上发布一个Vue组件的方法步骤
2018/12/20 Javascript
JavaScript基于遍历操作实现对象深拷贝功能示例
2019/03/05 Javascript
[06:15]2016国际邀请赛中国区预选赛单车采访:我顶WINGS
2016/06/27 DOTA
详解python上传文件和字符到PHP服务器
2017/11/24 Python
python中使用PIL制作并验证图片验证码
2018/03/15 Python
python读取word文档,插入mysql数据库的示例代码
2018/11/07 Python
对python自动生成接口测试的示例讲解
2018/11/30 Python
谈谈Python中的while循环语句
2019/03/10 Python
django一对多模型以及如何在前端实现详解
2019/07/24 Python
仓库管理制度
2014/01/21 职场文书
小学兴趣小组活动总结
2014/07/07 职场文书
中队活动总结
2014/08/27 职场文书
晚自修旷课检讨书怎么写
2014/11/17 职场文书
出纳岗位职责
2015/01/31 职场文书
物业客服专员岗位职责
2015/04/07 职场文书
CSS 新特性 contain控制页面的重绘与重排问题
2021/04/30 HTML / CSS
CSS 实现多彩、智能的阴影效果
2021/05/12 HTML / CSS
JavaScript分页组件使用方法详解
2021/07/26 Javascript