Question

我是一个蹒跚学步的骨干js，昨天出生了..

遵循本教程 - https://www.youtube.com/watch?v=_6pBvMK1Qgo

我正在尝试执行这个简单的视图代码，但不知何故，渲染方法没有被调用 -

    <script type="text/javascript">
    model = Backbone.Model.extend ({
        data : [
            {text : "Google", href : "www.google.com"},
            {text : "Facebook", href : "www.facebook.com"}
        ]
    });

    var View = Backbone.View.extend({
        initialize : function () {
            console.log('Initializing...!!!');
            this.template = $('#list-template').children();
        },
        el : '#container',
        events : {
            'click' : 'render'
        },
        render : function () {
            console.log('button clicked');
            var data = this.model.get('data');
            for (i=0, j=data.length; i<j; i++) {
                var li = this.template.clone().find('a').attr('href', data[i].href).text(data[i].text).end();
                this.$el.find('ul').append(li);
            }
        }
    });

    var view = new View({model : model});
</script>
<div id="container">
    <button>Load</button>
    <ul id="list">
    </ul>
</div>

<div id="list-template">
    <li><a href=""></a></li>
</div>

请让我知道我做错了什么愚蠢。

控制台日志提供 -

 Initializing...!!!

Answer 1

首先，您应该以正确的方式描述您的模型 - 创建一个类，然后创建此类的实例：

var Model = Backbone.Model.extend ({});
var model = new Model({
    data : [
        {text : "Google", href : "www.google.com"},
        {text : "Facebook", href : "www.facebook.com"}
    ]
});

您可以直接致电render()：

var view = new View({model : model});
view.render();

但您的click事件也可行。这是工作jsfiddle：http://jsfiddle.net/utm3w6nb/3/

Answer 2

我发现了这个问题。我的脚本在我的DOM之上，所以在我的DOM初始化之前渲染。我已经准备好了jquery，它现在正在运行。感谢

Backbone js视图渲染单击方法不调用[Very Basic]

2 个答案: