Question

我正在学习Enyo js框架中的事件，并且无法理解为什么我得到错误并且没有处理onModelChanged事件。错误消息是＆＃34; Uncaught TypeError：undefined不是函数＆＃34;

代码：

debugger; 
enyo.kind({
    name : "MyModel",
    kind: "enyo.Model",
    defaultSource: "mocked",
    published: {
        title : "not set",
        text : "not set",       
    },

    events : {
        onModelChanged : "",
    },

    handlers: {
        onModelChanged : "modelLoadedHandler" 
    },

    modelLoadedHandler : function(inSender, inEvent){
        debugger;
        console.log("handler in model");
        console.log(inEvent.textMsg);
        return true;
    },

    fetch : function(opts){
        this.inherited(arguments);
        debugger;
        this.doModelChanged({textMsg: "fire event"}); // Uncaught TypeError: undefined is not a function

    }       

});



var model = new MyModel();
model.fetch();

P.S。保留此代码作为答案，不要被jsfiddle删除

enyo.kind({
    name: "MyMockSource",
    kind: "enyo.Source",
    fetch: function(model, opts) {
        if(model instanceof enyo.Model) {
            opts.success({title: "testing", text: "Some stuff"});
        } else {
            throw new Error("Model mock only");
        }
    }
});

new MyMockSource({name: "mocked"});

enyo.kind({
    name : "MyModel",
    kind: "enyo.Model",
    source: "mocked",
    attributes: {
        title : "not set",
        text : "not set",       
    },
    fetched: function(opts){
        this.inherited(arguments);
        enyo.log("fetched");
        // Do something here if you need to, otherwise you might want to overload
        // the parse method and set parse: true to modify the retrieved data
    },
    titleChanged: function(was, is) {
        enyo.log("Title is now: " + is);
    }
});

enyo.kind({
    name: "MyView",
    components: [
        {kind: "Button", content: "Fetch", ontap: "fetch"},
        {name: "title"},
        {name: "text"}
    ],
    bindings: [
        {from: "model.title", to: "$.title.content"},
        {from: "model.text", to: "$.text.content"}
    ],
    fetch: function() {
        this.set("model", new MyModel());    // Probably want to create model elsewhere
        this.model.on("change", enyo.bindSafely(this, "modelChanged"));
        this.model.fetch();
    },
    modelChanged: function() {
        this.log("Something happened to my model!");
    }
});

new enyo.Application({ name: "app", view: "MyView" });

Answer 1

以这种方式使用事件系统时，通常期望链上方的组件处理onModelChanged事件，而不是定义事件的组件。此外，enyo.Model是一个特例，我相信使用不同的观察者机制。这可能是你为函数调用得到“未定义”的原因，因为onModelChanged和doModelChanged方法之间没有魔术映射。

Answer 2

enyo.Model不是enyo.Object（更不用enyo.Component）。它不支持已发布的属性或事件。您想为模型定义attributes。您仍然可以使用propertyChanged事件或使用observers来获取有关媒体资源更改的通知。

此外，如果您想知道提取已完成，您可能希望重载fetched。 fetch可能在获取数据之前返回。

如果您想订阅来自外部的事件，那么您可能希望使用changed绑定到模型上的特定属性或model.on('change')事件（请注意，这是与其他地方使用的events: []系统。

更新：这是一个小提琴，展示了使用模型和绑定数据的各种方法

http://jsfiddle.net/RoySutton/5jo0p7ar/

在简单示例中，未处理和未定义Enyo自定义事件

2 个答案: