如何将输入文本值或数据一个视图发送到另一个视图?

时间:2015-10-07 14:11:04

标签: javascript backbone.js marionette backbone-views backbone-routing

请告诉我如何将数据从一个视图发送到另一个视图。实际上我在主屏幕上有一个输入字段和按钮。我想在按钮点击时将输入文本的数据从一个屏幕发送到另一个屏幕。我想将输入字段的文本从一个视图发送到另一个视图。我可以在按钮单击时将一个屏幕移动到另一个屏幕,但我无法在另一个屏幕上发送输入文本

这是我的代码 http://plnkr.co/edit/pz9NBhtq4fX0m6N4wDqB?p=preview

 events: {
         'click #click':'moveTonext'
        },

       moveTonext: function(){
          new Router().navigate('secondView', { trigger: true });
        },

1 个答案:

答案 0 :(得分:0)

为此,您需要从SecondView函数中实例化.moveToNext(),并提供必要的参数:

// app.js
moveTonext: function(){
    new SecondView({ 
        model: new Backbone.Model({
            value: this.$("input").val()
        })
    });
},

您还需要更新第二个视图,以便为模板提供模型的属性:

// second.js
render: function(){
    this.$el.html(this.template(this.model.toJSON()));
},

模板本身:

// second.html
<h1>Value from previous page: <%- value %></h1>

这是一个更新的Plunker sample

修改

使用参数化路线可以实现同样的目的:

// router.js
routes: {
    'secondView(/:msg)': 'secondView'
},

secondView: function(msg) {
  new SecondView({ model: new Backbone.Model({ value: msg || '' }) });
}

// app.js
moveTonext: function() {
    new Router().navigate(
        'secondView/' + this.$('input').val(),
        { trigger: true }
    );
},

此处为此Plunker