Question

默认代码

·当用户输入时，由于

四次显示两次

   var Model = function () {
        this.num = m.prop(10);
    };
    var MyApp = {
        controller: function() {
          this.data = new Model('');
        },
        view: function(ctrl) {
            return m("div", [
                 "multiple1:",m("input", {oninput: m.withAttr("value", ctrl.data.num), value: ctrl.data.num()}),
                m("br"),
                m.component(NestComponent, {value: ctrl.data.num()}) //10
            ]);
        }
    };
    var NestComponent  = {
        controller: function() {
            return {
                multiple2: function(value) { //10
                    return (parseInt(value) * 2)
                },
                multiple4: function(value) { //10
                    return (parseInt(value) * 4)
                }
            }
        },
        view: function(ctrl, args) {
            return m('div', [
                "multiple2:", ctrl.multiple2(args.value),
                m("br"),
                "multiple4:", ctrl.multiple4(args.value),
            ]);
        }
    };
    m.mount(app, MyApp)

代码无法正常工作

·当用户输入顶部表格时，从顶部开始按顺序显示1次2次4次结果。

·当用户输入表格的中心时，显示1/2倍1倍于顶部的结果。

·当用户以底部的形式输入时，它会从顶部开始按顺序显示1/4倍1/2倍的结果。

var Model = function () {
    this.num1 = m.prop(10);
    this.num2 = m.prop(20);
    this.num4 = m.prop(40);
    // this.num2 = this.num1*2;
    // this.num4 = this.num1*4;
    // this.num2 = m.prop(10)*2;
};

var MyApp = {
    controller: function() {
      this.data = new Model('');
    },
    view: function(ctrl) {
        return m("div", [
             "multiple1:",m("input", {oninput: m.withAttr("value", ctrl.data.num1), value: ctrl.data.num1()}),
            m("br"),
            m.component(NestComponent, {val1: ctrl.data.num1(),val2: ctrl.data.num2(),val4: ctrl.data.num4(),mainCtrl: ctrl})
        ]);
    }
};
var NestComponent  = {
    controller: function() {
        return {
            multiple2: function(value) {
                console.log(value);
                return (parseInt(value) * 2)
            },
            multiple4: function(value) {
                return (parseInt(value) * 4)
            }
        }
    },
    view: function(ctrl, args) {
        return m('div', [
            "multiple2:", m("input", {oninput: m.withAttr("value", args.mainCtrl.data.num2()), value: args.val2}),
            m("br"),
            "multiple4:", m("input", {oninput: m.withAttr("value", args.mainCtrl.data.num4()), value: args.val4}),
        ]);
    }
};
m.mount(app, MyApp)

Answer 1

您的第二个代码段输入不应该执行道具：args.mainCtrl.data.num4()最后不应该有括号。

为了相互对应Mithril的多个输入？

1 个答案: