如何在客户端的元窗口小部件(JavaScript）中获取和显示更新的域模型

How to Get and Show Updated Domain Model in Metawidgets (JavaScript) within the Client?

本文关键字：获取 显示 更新 JavaScript 模型 客户端 窗口 小部      更新时间：2024-05-11

我使用的是javascript的Metawidgets，如果对其进行了任何更改，我希望访问并显示更新后的域模型，而无需路由回服务器（例如：所有这些都在同一客户端javascript中）。遗憾的是，我能找到的每一个例子都回到了服务器或插入了一个框架。

下面是一个示例，显示了我在获取更新模型时遇到的问题。更改页面上的值，单击"显示"并查看控制台窗口。请注意，它仍然显示旧值。

<!DOCTYPE html>
<html>
<head>
   <script src="metawidget-4.1/js/lib/metawidget/core/metawidget-core.min.js" type="text/javascript"></script>
 </head>
 <body style="font-family:Arial">
    <div id="metawidget"></div>
    <script type="text/javascript">
        var mw = new metawidget.Metawidget( document.getElementById( 'metawidget' ) );
        mw.toInspect = {
            name: 'X',
            age: 40,
            display: function(x) {
                // This never shows the updated model if the user changes values
                console.log(this);
            }
        };
        mw.buildWidgets();
    </script>
</body>
</html>

如果域对象从代码中更改，我如何让Metawidget自动显示更新版本的域对象？例如，如果我要增加年龄（例如：显示中的person.age++或this.age++），页面不会自动反映这一点。

您在这里提出了两个问题。我将分别回答。

  1. 如何让Metawidget将小部件中的值保存回域对象要做到这一点，您的代码应该看起来像：

       display: function(x) {
        mw.save();
        console.log(this);
    }

  2. 如何让Metawidget用新值重新绘制小部件要做到这一点，您的代码应该看起来像：

       display: function(x) {
        this.age++;
        mw.buildWidgets();
    }

但是，我应该说您编写此代码的方式有点奇怪。如果这只是一个用于学习目的的快速示例，那也没关系，但在生产代码中，您可能希望解耦。

例如，您通常不会在内联中定义.toInspect，而是在其上具有直接引用mw的函数。

相关文章：