2

我在某处读到，每次发生事件时都会更新 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()不起作用。

4

1 回答 1

4

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

至于你的例子，问题不是秘银而是事件。您需要使用oninput而不是onchange寻找即时更改。正如“更改”事件的 Mozilla 文档所述：

当用户提交对元素值的更改时，将为 input、select 和 textarea 元素触发 change 事件。与输入事件不同，更改事件不一定会针对元素值的每次更改而触发。

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

请注意，当使用正确的事件时，您现在不再需要m.redraw事件处理程序，因为 Mithril 在调用m().

于 2015-07-22T08:31:16.147 回答