Mithril？の複数の入力に相互に対応するためには？

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) 

---

の結果として、ユーザの入力、表示が二回、4回・ときユーザーはトップフォームを入力し、結果を上から順に2倍の4倍に1回表示します。

・ユーザーがフォームの中央を入力すると、上からの結果の2倍の1/2倍を表示します。

・ユーザがボトムの形で入力すると、上から順に結果の1/4倍の1/4倍を表示します。

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

あなたの2番目のコードスニペットの入力は小道具を実行すべきではない：args.mainCtrl.data.num4()は、最後に括弧を持つべきではありません。