秘银你好世界 MVC 示例不起作用答案

【问题标题】：mithril hello world MVC example not working秘银你好世界 MVC 示例不起作用
【发布时间】：2015-03-16 00:28:35
【问题描述】：

我无法让 Mithril hello world MVC 示例正常工作。

这是我的代码，从Mitrhil homepage 复制而来。请注意，我所做的唯一更改是将 m.request({method: "GET", url: "pages.json"}); 方法调用交换为手动生成的 pages 对象。

//namespace
var app = {};

//model
app.PageList = function() {
    var pages = [];
    pages.push({title: 'page 1', url: '/page1.html'});
    pages.push({title: 'page 2', url: '/page2.html'});
    return pages;
};

//controller
app.controller = function() {
    var pages = app.PageList();
    return {
        pages: pages,
        rotate: function() {
            pages().push(pages().shift());
        }
    }
};

//view
app.view = function(ctrl) {
    return [
        ctrl.pages().map(function(page) {
            return m("a", {href: page.url}, page.title);
        }),
        m("button", {onclick: ctrl.rotate}, "Rotate links")
    ];
};

//initialize
m.module(document.getElementById("example"), app);

如您所见，我上面在 jsFiddle 中的示例不起作用，但另一个 Mitrhil 示例，待办事项应用程序 jsFiddle 可以正常工作。

我认为基本的 MVC Mitrhil 示例可以像 Todo 应用一样简单地工作，并且可能链接到 jsFiddle 或 CodePen 示例供用户分叉，类似于 React。

【问题讨论】：

标签： javascript html model-view-controller mithril.js

【解决方案1】：

有一些对pages 的调用应该是变量引用，因为它是一个数组。这是修复：http://jsfiddle.net/jug68s27/4/

ctrl.pages() -> ctrl.pages

pages().push(pages().shift()) -> pages.push(pages.shift())

【讨论】：

谢谢，这是否意味着秘银网站主页上的示例也不正确？因为m.request({method: "GET", url: "pages.json"}) 不会返回一个数组，或者返回一个方法。无论是使用数组，还是从示例端点返回数据，在他们的网站上创建一个简单的 jsFiddle 链接都可能是个好主意。
m.request 返回一个 GetterSetter，它是一个函数，因此当您将其更改为数组时出现问题。使用 jsFiddle 作为示例的好主意。如果您愿意，请在 github 上为此打开一个问题（或提出拉取请求）！

【解决方案2】：

在此示例中，值不会重绘，因为您没有使用 m.prop，如果您希望更改值，您可以使用 var pages = m.prop(''); 现在您可以使用pages().push 或ctrl.pages().map，因为m.prop 是一个函数！！！！记住这一点很重要，你会经常用到它

【讨论】：