Question

我是javascript及其生态系统的新手。我正在尝试使用mithril.js构建一些组件。我的目标是拥有一个显示一些属性并为每个属性提供几个按钮的组件。只是要了解mithril.js和jsx。这是我到目前为止所做的：

const m = require("mithril");
var Something = {
  _increase: function(category) {
    console.log("increase category: "+category);
  },
  _decrease: function(category) {
    console.log("decrease category: "+category);
  },
  view: function(vnode) {
    return <div> 
      {Object.keys(vnode.attrs.categories).map((category)=> {
        return <div>
          <label for={category}>{category}</label>
          <input type="number" id={category} value={vnode.attrs.categories[category]} />
          <button type="button" onclick="{this._increase(category)}">MORE</button>
          <button type="button" onclick="{this._decrease(category)}">LESS</button>
        </div>
      })}
    </div>
  }
}
export default Something;

好吧，组件似乎工作正常，节点没有抱怨，并且标签，按钮和字段显示在页面上，但是，当我单击按钮时，什么也没发生。看来事件未触发。怎么了？

Answer 1

两件事：（1）我认为您应该将函数放在onclick处理程序括号中，而不是将函数编码为字符串。（2）似乎您正在立即调用该函数，而不是声明onclick处理程序是使用category参数的函数。尝试传入不带参数的匿名函数，这样，在触发onclick事件时，您可以将类别作为参数：

onclick={() => this._increase(category)}
onclick={() => this._decrease(category)}

使用mithril.js和jsx建立一些UI

1 个答案: