Question

我在某处读到，每次事件发生时DOM都会更新，并且绑定到DOM的数据会发生变化。所以我希望了解更多相关信息。我尝试了下面的代码，但是当textarea中的数据发生变化时，DOM不会更新，但每当我点击或按Tab键时它都会更新。

var app = {
    controller: function () {
        var self = this;
        this.model = {};
        this.model.errors = [];
        this.break_data = function (value) {
            self.model.errors = value.split(' ');
            m.redraw();
        }
    },
    view: function (ctrl) {
        return m('.content', [
            m('textarea', {onchange: m.withAttr('value', ctrl.break_data)}),
            ctrl.model.errors.map(function (error) {
                return m('.error', error);
            })
        ]);
    }
}

m.mount(document.getElementById('app'), app);

我甚至尝试了m.startComputaion()，m.stopComputation()和m.redraw()非他们的作品。

Answer 1

此处描述了重绘时间：https://stackoverflow.com/a/30728976/70894

至于你的例子，问题不是秘银，而是事件。您需要使用oninput代替onchange来查找即时更改。正如Mozilla docs for the "change" event所述：

对input，select和textarea触发change事件元素的值更改时的元素用户。与输入事件不同，更改事件不一定每次更改元素值时都会触发。

以下是使用oninput的代码的小提琴：http://jsfiddle.net/ciscoheat/LuLcra77/

请注意，当使用正确的事件时，您现在不再需要m.redraw事件处理程序，因为在调用m()时定义的每个事件后，Mithril会自动重绘。

Mithriljs不会在数据更改时更新DOM

1 个答案: