在 Mithril 中无法让 m.request 自动转换为 class

Trouble getting m.request to auto-cast to a class in Mithril

我已经定义了一个 class 并要求 m.request 将网络服务的 JSON 响应投射到它,但是每个 class 属性都等于n/b(),我的视图将每个 属性 呈现为 function (){return arguments.length&&(a=arguments[0]),a}

如果我不尝试将 JSON 响应自动投射到 m.request 中的 class,那么我的视图呈现得很好,我认为这告诉我 JSON Web 服务返回的对象有效 JSON.

我想用我的 class。怎么了?

这是网络服务返回的 JSON 的编辑示例:

{
  "responseHeader":{
    "status":0,
    "QTime":0,
    "params":{
      "q":"blah blah",
      "indent":"true",
      "wt":"json"}
  },
  "response":{
    "numFound":97,
    "start":0,
    "docs":[
      {
        "identifier":"abc123",
        "heading":"A Great Heading",
        "id":"abc-123-1",
        "title":"A Title",
        "url":"path/to/some.html",
        "content":["Blah blah blah blah blee blah."]
      },
      {
        "identifier":"xyz789",
        "heading":"Another Heading",
        "id":"xyz-789-1",
        "title":"Another Title",
        "url":"another/path/to.html",
        "content":["My bonny lies over the ocean."]
      }
    ]
  }
}

这是我的秘银应用程序:

var findus = {};

findus.Document = function (data) {
    this.id = m.prop(data.id);
    this.title = m.prop(data.title);
    this.heading = m.prop(data.heading);
    this.identifier = m.prop(data.identifer);
    this.url = m.prop("//" + data.url + "#" + data.identifier);
};

findus.vm = (function() {
    var vm = {};
    vm.init = function () {

        // user input
        vm.queryText = m.prop("");

        vm.search = function () {
            if (vm.queryText()) {
                vm.results = m.request({
                    method: "GET", 
                    url: "/prd/query?q=" + vm.queryText(), 
                    type: findus.Document,
                    unwrapSuccess: function (response) {
                        return response.response.docs;
                    },
                    unwrapError: function (response) {
                        console.log(response);
                    }
                }).bind(vm);
            }
        };


    };
    return vm;
}());

findus.controller = function () {
    findus.vm.init();
};

findus.view = function () {

    return [
        m("input", {onchange: m.withAttr("value", findus.vm.queryText), value: findus.vm.queryText()}),
        m("button", {onclick: findus.vm.search}, "Search"),
        findus.vm.results ? m("div", [
            findus.vm.results().map(function (result) {
                return m("div", [
                    m("h2", result.heading),
                    m("p", result.content),
                    m("a", {href: result.url}, result.url)
                ]);
            })
        ]) : ""
    ];

};

m.module(document.body, {controller: findus.controller, view: findus.view});

哦,混蛋。我忘记了我的 class 属性是 getter/setters 通过 m.prop,所以我应该在视图中将它们称为函数——见下文。

虚惊一场,问题解决了,不好意思

findus.view = function () {

    return [
        m("input", {onchange: m.withAttr("value", findus.vm.queryText), value: findus.vm.queryText()}),
        m("button", {onclick: findus.vm.search}, "Search"),
        findus.vm.results ? m("div", [
            findus.vm.results().map(function (result) {
                return m("div", [
                    m("h2", result.heading()),
                    m("p", m.trust(result.content())),
                    m("a", {href: result.url()}, result.url())
                ]);
            })
        ]) : ""
    ];

};