Создайте пользовательский интерфейс с помощью mithril.js и jsx - PullRequest
Новая
       28

Создайте пользовательский интерфейс с помощью mithril.js и jsx

0 голосов
/ 30 декабря 2018

Я новичок в 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;

Ну, компонент, кажется, работает нормально, узел не жалуется, и на странице отображаются метки, кнопки и поля, но, когда я нажимаю на кнопку,ничего не случилось.Похоже, что событие не запущено.Что не так?

1 Ответ

0 голосов
/ 30 декабря 2018

Две вещи: (1) я думаю, что вы должны просто поместить функцию в фигурные скобки обработчика onclick вместо того, чтобы кодировать функцию в строку.(2) Похоже, что вы немедленно вызываете функцию, а не объявляете, что обработчик onclick является функцией, использующей аргумент категории.Попробуйте передать анонимную функцию без аргументов, чтобы при возникновении события onclick она могла быть указана в категории в качестве параметра: 

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