Backbone.js模型(Model)和视图(View)如何实现双向绑定

Backbone.js是一个轻量级的JavaScript框架，用于构建Web应用程序。其中，模型（Model）和视图（View）的双向绑定是其核心特性之一。这个示例将详细介绍如何使用Backbone.js实现模型和视图之间的双向数据绑定。

// 软件版本号：Backbone.js 1.5
// 编写软件：Web应用程序

// 定义一个Backbone模型
var TaskModel = Backbone.Model.extend({
  defaults: {
    title: '',
    completed: false
  }
});

// 创建一个任务模型实例
var task = new TaskModel({ title: '完成示例', completed: false });

// 定义一个Backbone视图
var TaskView = Backbone.View.extend({
  el: '#task-container',
  initialize: function () {
    this.listenTo(this.model, 'change', this.render);
  },
  render: function () {
    this.$el.html('<h2>' + this.model.get('title') + '</h2>');
  }
});

// 创建一个任务视图实例，并将其与任务模型关联
var taskView = new TaskView({ model: task });
taskView.render();

// 更新模型数据，触发双向绑定
task.set('title', '完成示例并解释');

免责申明：文章和图片全部来源于公开网络，如有侵权，请通知删除 server@dude6.com