Question

我试图使用Ractive使用组件实现单页面应用程序，我需要一些页面范围的选项。我确实喜欢这个：

...
data: {
    options: {
        someOption: true
    },
...

我使用{{#if options.someOption}}时一切都很好，但后来遇到了问题 - rective.get('options.someOption')返回undefined（都是ractive.get('options')）。观察也不行。有没有办法让我的代码了解我？

UPD。一部分魔法意外解决了问题 - 当我在模板上放置{{options.someOption}}时，get（）开始工作。

Answer 1

实例中的反向编程数据访问（包括组件）当前只能“看到”以下数据：

定义为数据
明确指定为组件参数
用作模板

对于＃1，您可以将选项包含为默认数据，并且它可供所有实例使用：

Ractive.default.data = {
    options: {...}
}

任何新的Ractive实例（包括组件）都将具有options数据属性。

对于＃2，即使你有深层嵌套的组件，你也可以让需要数据的组件的父组件将它作为参数包含在内：

// Component somewhere in the "app" hierarchy.
// By referencing {{options}} in its template, it will find that data
// make it explicit on the widget component, which can then use it
// programmatically

<widget options='{{options}}'/>

对于＃3，您可以在组件模板中包含“虚拟”引用：

// by using it in the template, it is now available for programatic access
{{#with options}}{{/with}}

当然还有＃4，增强Ractive以允许代码中的相同查找作为模板

从父作用域获取数据

1 个答案: