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 相关文章推荐
JavaScript 直接操作本地文件的实现代码
Dec 01 Javascript
js实现双向链表互联网机顶盒实战应用实现
Oct 28 Javascript
使用PHP+JQuery+Ajax分页的实现
Apr 23 Javascript
jquery中获取id值方法小结
Sep 22 Javascript
Javascript显示和隐藏ul列表的方法
Jul 15 Javascript
JavaScript html5 canvas画布中删除一个块区域的方法
Jan 26 Javascript
微信小程序 安全包括(框架、功能模块、账户使用)详解
Jan 16 Javascript
详谈JavaScript的闭包及应用
Jan 17 Javascript
浅谈Vue.js 组件中的v-on绑定自定义事件理解
Nov 17 Javascript
浅谈webpack 四个核心概念之Entry
Jun 12 Javascript
Vue使用预渲染代替SSR的方法
Jul 02 Javascript
前端监听websocket消息并实时弹出(实例代码)
Nov 27 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
destoon实现不同会员组公司名称显示不同的颜色的方法
2014/08/22 PHP
php根据数据id自动生成编号的实现方法
2016/10/16 PHP
详解PHP中mb_strpos的使用
2018/02/04 PHP
php操作redis数据库常见方法实例总结
2020/02/20 PHP
js身份证验证超强脚本
2008/10/26 Javascript
Window.Open如何在同一个标签页打开
2014/06/20 Javascript
JS实现带有抽屉效果的产品类网站多级导航菜单代码
2015/09/15 Javascript
静态页面html中跳转传值的JS处理技巧
2016/06/22 Javascript
JavaScript运动框架 解决速度正负取整问题(一)
2017/05/17 Javascript
基于angular6.0实现的一个组件懒加载功能示例
2018/04/12 Javascript
vue中element-ui表格缩略图悬浮放大功能的实例代码
2018/06/26 Javascript
jQuery中实现text()的方法
2019/04/04 jQuery
Websocket 向指定用户发消息的方法
2020/01/09 Javascript
9种方法优化jQuery代码详解
2020/02/04 jQuery
在vue中使用image-webpack-loader实例
2020/11/12 Javascript
JavaScript实现前端倒计时效果
2021/02/09 Javascript
pycharm 使用心得(七)一些实用功能介绍
2014/06/06 Python
解决TensorFlow GPU版出现OOM错误的问题
2020/02/03 Python
python简单的三元一次方程求解实例
2020/04/02 Python
详解Open Folder as PyCharm Project怎么添加的方法
2020/12/29 Python
selenium如何定位span元素的实现
2021/01/13 Python
pycharm 关闭search everywhere的解决操作
2021/01/15 Python
python实现银行账户系统
2021/02/22 Python
Python 实现劳拉游戏的实例代码(四连环、重力四子棋)
2021/03/03 Python
美津浓巴西官方网站:Mizuno巴西
2019/07/24 全球购物
网上常见的一份Linux面试题(多项选择部分)
2015/02/07 面试题
历史专业个人求职信范文
2013/12/07 职场文书
学习党课思想汇报
2013/12/29 职场文书
四风存在的原因分析
2014/02/11 职场文书
简单的大学生自我鉴定
2014/02/18 职场文书
《宋庆龄故居的樟树》教学反思
2014/04/07 职场文书
玩手机检讨书1000字
2014/10/20 职场文书
2014年设备管理工作总结
2014/11/26 职场文书
小学安全教育主题班会
2015/08/12 职场文书
2016教师国培研修感言
2015/12/08 职场文书
用Python编写简单的gRPC服务的详细过程
2021/07/04 Python