数据壳

和 app 壳不同，’data shell’ 并不是一个炒作的术语。事实上，它只供我使用，它指的是用动态参数池来驱动数据流。它不是更改当前页面，它只更新页面的数据。改变当前页面通常会改变参数池，但改变参数池的参数不会导致页面刷新。

通常情况下，数据壳是由一组原始值－还有当前页面所组成，它表示当前程序的状态。因此，它可以用来保存加载和分享状态。为了达到这个目的，它必须在 URL，localStorage 或者浏览器历史中体现－这使它实质上是全局的。

NX 众多组件之中的控制组件可以通过声明性配置连接到参数池，它会决定参数如何和组件的状态，URL，浏览器历史和网页存储进行交互。

nx.components.control({
  template: require('./view.html'),
  params: {
    name: { history: true, url: true, default: 'World' }
  }
}).register('greeting-comp')

<p>Name: <input type="text" name="name" bind/></p>
<p>Hello @{name}</p>

以上示例代码创建了一个组件，使得 name 属性与 URL 和浏览器历史保持同步。你可以在如下看到效果。

多亏了基于 ES6 代理的透明反射，同步是无缝的。你可以书写 vanilla JavaScript，所有的东西都会在后台按需双向绑定。下图给出了一个这方面的高级概述。

简单的声明式的语法鼓励开发者在编程之前花几分钟时间设计页面的网页整合。并不是所有的参数都应该进入 URL 或者当页面改变的时候添加一个新的历史记录项。有大量的不同情况，每种情况都得进行适当配置。

• 一个简单的文本过滤器应该是一个 url 参数，因为它应该可以与其他用户共享。
• 一个账户 id 应该是一个 url 和 history 参数，因为目前的账户应该是可分享，并且改变它是足以用来添加一个新的历史记录项。
• 一个视觉选项应该是一个可持久的参数（保存在本地存储中），因为它应该为每个用户持久化，并且不应该被共享。

这只是一些可能的设置。只需要最少的努力，你就可以真正地让这些参数完美地适用于你的使用场景。