对象UI中的Nativescript可观察对象未更新

时间:2018-10-29 16:55:22

标签: observable nativescript

我是本机脚本的新手,对可观察对象中的可观察对象有疑问/疑问。

我有一个带有抽屉的应用程序。每个页面都通过其navigationContext从抽屉页面获取其绑定上下文。我需要一些存储在页面中的数据。所以每个页面的bindingContext看起来都像这样……

const viewModel = observableModule.fromObjectRecursive({
    local_var1: "something as string",
    local_var2: true,
    globaldata: { global_var1: "global string",  global_var2: true }
});

在我的xml文件中,我可以毫无问题地绑定到globaldata.global_var2。我用它来使某些部分可见或折叠。 当globaldata.global_var2的内容更改时,不会更新UI。我尝试使用.set(“ var”,true)以及直接设置变量。但是用户界面并没有改变。 为了进行测试,我尝试使用local_var2,这样UI就会更新。

我还创建了一个很小的游乐场。...

https://play.nativescript.org/?template=play-js&id=9dn3Yk&v=10

有人可以向我解释为什么可观察对象内部的可观察对象的更改未反映在UI中吗?

提前致以最诚挚的问候 英戈

1 个答案:

答案 0 :(得分:1)

我在您的游乐场中看到两个问题,并且修复两个问题似乎都能使其按预期工作。首先,home-view-model.js中的此代码需要更改:

var viewModel = observableModule.fromObjectRecursive({
  test: { boolShow = false }
});

应该为boolShow: false,或者至少对我来说可以成功运行,而现有版本则不能。

通过这种方式,我注意到test.boolShow中两个对homepage.xml的引用都使用了表达式:

visibility="{{ test.boolShow ? 'visible' : 'collapsed' }}"

text="{{ 'Touch me! ' + test.boolShow }}"

NativeScript侦听来自所引用属性的更改事件,但是由于某种原因,即使它足够了解表达式,它也无法从表达式中解析它。我所见的解决方法是先放置属性键,然后是逗号,然后是表达式,如下所示:

visibility="{{ test.boolShow, test.boolShow ? 'visible' : 'collapsed' }}"

text="{{ test.boolShow, 'Touch me! ' + test.boolShow }}"

如果执行此操作,则应该看到界面正确更新。我尚未见到有关表达式语法的任何文档,但是如果您将其视为comma operator的用法,则上述意义是合理的,actually accepts 1, 2, or 3 parameters评估左侧,但仅返回右侧-手侧。

但是,我希望看到更好的文档,因为我发现绑定系统的代码相当难于理解,并且我所看到的示例仅涵盖特定情况,而许多问题尚未得到解答。例如,我们可以/应该在表达式之前添加多个属性值吗?如果我指的是a.b.c,那么abc都必须是可观察的,否则只要a和{{1 }}是?希望能看到更全面的文档,因为该功能已被大量使用,如果使用不当会带来明显的后果。

编辑:

再次查看文档,由于数据绑定{{3}},我对逗号运算符的评论不合时宜。但是,文档似乎仍然无法回答我上面的公开问题。