防止在 Mithril 中重绘

Question

我为秘银制作了一个简单的 FlashMessage 模型，我用它来显示表单的反馈（例如，成功保存）：

// the model
var FlashMessage = {
    messages: [],

    clear: function()
    {
        FlashMessage.messages = [];
    },

    add: function(level, message)
    {
        var mess = {level:level, message: message};
        FlashMessage.messages.push(mess);
    },

    get: function()
    {
        var messages = FlashMessage.messages;
        FlashMessage.clear();
        return messages;
    }
};

module.exports = FlashMessage


// the use
m('section.flash-messages', FlashMessage.get().map(function(mess){return m('.message-' + mess.level, mess.message);}))

保存数据时，布局会显示闪现消息，这很好，但是当我在表单上再次输入数据时，闪现消息 div 似乎被重绘了，因为get 方法擦除数据，闪现消息消失。据我所知，这是因为当数据发生变化时秘银会重新绘制，但我该如何防止这种情况发生？

Answer 1

防止重绘很简单，正如我将向您展示的那样，但在您的情况下，这不是一个好的解决方案。相反，你应该改变你对状态的看法。

防止重绘

只需将函数 onbeforeupdate 添加到您的组件，如果您不想更新，则 return false。

var Component = {
    onbeforeupdate: function (vnode, old) {
        var shouldUpdate = ???;

        return shouldUpdate;
    }
    ...
};

思考状态

您的应用程序状态应始终反映在 UI 中。如果状态改变，显示的内容也应该改变。这是 React 和所有的核心原则它启发了图书馆，其中包括秘银。这样做就可以易于编写有状态应用程序，这就是这些库受欢迎的原因。

以任何其他方式进行操作都是（非常）糟糕的做法。你将很难让它正常工作，不仅因为 [Mithril] 旨在确保状态更新始终反映在 UI 中，但也因为很难推理。（另外，您的代码对其他人没有意义。）

你的情况

如果你想让消息留在屏幕上，它们也应该保持在状态。

只有当您希望消息消失（在屏幕上）时，您才应该将它们从状态中移除。

请 post 一个新问题，解释你想要实现的目标，我会告诉你如何去做:)

防止在 Mithril 中重绘

Preventing redraw in Mithril

mithril.js

防止重绘

思考状态

你的情况