MVC写这种程序真是够大材小用的了,可没想到居然这么抽象!

// 这是一个管理者视图/控制/模型 的全局类
var App = {
Models: {},
Views: {},
Controllers: {},
Collections: {},
initialize: function() {
new App.Controllers.Routes();
Backbone.history.start() // 要驱动所有的Backbone程序,Backbone.history.start()是必须的。
}
}; App.Models.Hello = Backbone.Model.extend({
url: function() {
return '/api.php'; // 获得数据的后台地址。
},
initialize: function() {
this.set({'message':'hello world'}); // 前端定义一个message字段,name字段由后端提供。
}
}); App.Views.Hello = Backbone.View.extend({
el: $("body"),
template: $("#<span style="font-family: monospace; white-space: pre; ">hello-container-template</span>").html(),
initialize: function(options){
this.options = options;
this.bind('change', this.render);
this.model = this.options.model;
},
render: function(){ // render方法,目标只有两个:填充this.el,返回this以便链式操作。
$(this.el).html(Mustache.to_html($(this.el).template,this.model.toJSON()) );
return this;
}
}); App.Controllers.Routes = Backbone.Controller.extend({
routes: {
"!/hello" : "hello",//使用#!/hello驱动路由
},
hello : function() {
//新建一个模型,模型向后端请求更新内容成功后根据模型渲染新页面
var helloModel = new App.Models.Hello;
helloModel.fetch({
success: function(model){
var helloView = new App.Views.Hello({model: model});
helloView.trigger('change');
}
});
}
});
App.initialize();

来自一个Backbone的Hello,World!的更多相关文章

  1. Backbone入门——开发第一个Backbone页面

    1. 功能描述在新建的html页面中,通过导入的backbone文件搭建一个简单的mvc结构.当用户进入该页时,id号为“divTip”的<div>元素中将显示“hello,backbon ...

  2. 【架构】生成全局唯一ID的3个思路,来自一个资深架构师的总结

    标识(ID / Identifier)是无处不在的,生成标识的主体是人,那么它就是一个命名过程,如果是计算机,那么它就是一个生成过程.如何保证分布式系统下,并行生成标识的唯一与标识的命名空间有着密不可 ...

  3. 第一次作业:来自一个奋斗的IT学子

    第一部分 结缘计算机 1.1你为什么选择计算机专业?你认为你的条件如何?和这些博主比呢?(必答) 说起为何结缘了计算机,就得谈谈专业报考了,我觉得我的报考真是一个反面教科书了.由于高中以前每天只要想着 ...

  4. 来自一个电子狂的stm32学习历程

    文章尾部有学习时的一些视频资料在学的可以看看那么我们就进入今天的主题我stm32的学习历程 在学习了51单片机之后,早已经对单片机这个东西甚有了解了,所有不管是从内部资源,还是一些常见应用,都可以说的 ...

  5. vue-cli@3.x之使用vue ui创建项目-来自一个战五渣的体验

    1. 全局安装vue-cli yarn global add @vue/cli // 检查安装是否成功 vue -V // 3.2.2 2. 初始化 vue ui 执行命令 vue ui 2.1 该命 ...

  6. Python: 为对象动态添加函数,且函数定义来自一个str

    转自:http://blog.sina.com.cn/s/blog_55a11f330100ab1x.html 在Python中,通常情况下,你只能为对象添加一个已经写好的方法 需求:传入一个str类 ...

  7. 来自一个用户的体验-Alpha项目测试

    软件梦之队成员:201731062305 周蓉 这个作业属于哪个课程 <课程的链接> 这个作业要求在哪里 <作业要求的链接> 团队名称 <软件梦之队>(附上团队博客 ...

  8. 来自一个大三开学三周的huster的迷茫与失措

    大三开学考研保研的话题开始多了起来.自从前天去听了一回谢长生教授的实验室宣讲会,回来直到现在都好像心头上压了些东西,喘不过气来.本来我就少与外界接触,加之我自己一个人主动学习的积极性也很是缺乏,所以当 ...

  9. backbone库学习-Router

    backbone库的结构http://www.cnblogs.com/nuysoft/archive/2012/03/19/2404274.html 本文的例子来自http://blog.csdn.n ...

随机推荐

  1. Ubuntu16.04 下虚拟环境的创建与使用

    1. 虚拟环境   虚拟环境(virtual environment),顾名思义是虚拟出来的环境,通俗来讲,可以借助虚拟机,docker来理解虚拟环境,就是把一部分内容独立出来,我们把这部分独立出来的 ...

  2. dividend = Integer.parseInt(args[0])参数问题

    先来一段代码: package yichang; public class MyExceptionTest { public static void main(String[] args) { int ...

  3. Flyway的第一次认识

    1.  引言 想到要管理数据库的版本,是在实际产品中遇到问题后想到的一种解决方案,当时各个环境的数据库乱作一团,没有任何一个人(开发.测试.维护人员)能够讲清楚当前环境下的数据库是哪个版本,与哪个版本 ...

  4. MT【148】凸数列

    (2018浙江省赛13题) 设实数$x_1,x_2,\cdots,x_{2018}$满足$x_{n+1}^2\le x_nx_{n+2},(n=1,2,\cdots,2016)$和$\prod\lim ...

  5. 【bzoj2780】 Sevenk Love Oimaster

    http://www.lydsy.com/JudgeOnline/problem.php?id=2780 (题目链接) 题意 给出很多主串和很多询问串,求一个询问串在多少主串中出现过 Solution ...

  6. Centos7搭建redis集群及安装sentinel

    准备三个节点,系统版本为CentOS7.3 11.0.8.15 master 11.0.8.16 slave01 11.0.8.17 slave02 1.安装redis # yum install - ...

  7. 解题:CF983A Finite or not

    题面 一个$b$进制最简分数是有限循环小数当且仅当其分母没有与$b$不同的质因子,小学数奥内容水过 #include<cstdio> #include<cstring> #in ...

  8. 解题:USACO14MAR Counting Friends

    题面 枚举每个数字是否能被删去,然后就是如何判定图是否存在.应该从按“度数”从大到小排序,从最大的顺次向其他点连边(先连“度数”小的可能会把一些可以和大“度数”点连接的点用掉).但是这个排序每连一次都 ...

  9. 微服务Kong(一)——简介

    重要提示: 本教程是根据 KONG 0.10.x 版本进行编写的. 一.什么是KONG Kong是一个可扩展的开源API层(也称为API网关或API中间件).它运行在任何RESTful API之前,并 ...

  10. Codeforces Round #302 (Div. 2) C 简单dp

    C. Writing Code time limit per test 3 seconds memory limit per test 256 megabytes input standard inp ...