Question

我曾经有过例如<template if="{{app.router.selectedPage == 'lobby'}}">围绕各自页面上的不同Polymer元素，但现在我已将其删除，因为让core-animated-pages执行其操作并翻转display属性要快得多section及其子项只是显示与否，如下所示。

        <core-animated-pages id="pages" selected="{{app.router.selectedPage}}" valueattr="data-page" fit>
          <section data-page="channels" layout vertical>
            <community-list id="community-list" app="{{app}}" viewModel="{{app.mainViewModel}}"></community-list>
          </section>
          <section data-page="lobby">
            <chat-view app="{{app}}" viewModel="{{app.mainViewModel.chatViewModel}}"></chat-view>
          </section>
          <section data-page="people" layout vertical>
            <people-list app="{{app}}" viewModel="{{app.mainViewModel.peopleViewModel}}"></people-list>
          </section>
          <section data-page="events">
            <inbox-list id="inbox-list" app="{{app}}" viewModel="{{app.mainViewModel.eventViewModel}}"></inbox-list>
          </section>
          <section data-page="news">
            <inbox-list id="inbox-list" app="{{app}}" viewModel="{{app.mainViewModel.newsViewModel}}"></inbox-list>
          </section>
        </core-animated-pages>

我将getters传递到viewModel属性，例如app.mainViewModel.chatViewModel，它获取适合给定频道/社区的视图模型的实例（此时我可以互换使用这两个术语）我们正在使用 - 例如，如果我们在“foo”中“频道，app.mainViewModel.chatViewModel返回”foo“频道的聊天视图模型。

问题：每当频道发生变化时，我都需要以某种方式再次触发视图模型的getter。

一个选项是在<template if="{{app.community != null}}">中包含特定通道的所有元素（即通道页面本身以外的所有元素），以便当我们不在通道中并重新连接时，这些元素实际上会分离当我们选择一个新频道时，重新触发getter并返回相关的视图模型。

我已经验证了有效，但我试图一直避免<template>每次破坏和重新创建元素的条件。

有什么更好的方法来解决我的架构？谢谢！

Answer 1

我刚建立了一个解决这个问题的路由器和行为（请参阅github上的akc42 / akc-router）。

解释整个事情超出了这个回复的范围，但简单来说就是attach函数中的路由器但是在异步等待从其父节点开始之后（我想这将是dom-bind模板）并解析DOM树用＆＃34;行为＆＃34;寻找所有元素在他们中。它将模型构建为这些元素的树。网址细分映射到每个＆＃34;行为＆＃34;。

关键问题是在URL更改（通过应用程序调用，或通过用户使用后退和/或前进按钮），路由器可以使用此树来调用行为，它通过调用元素来调用元素摘要电话。

（快速查看此设置的测试将非常简单地显示它是如何使用的）。

您的方法似乎有所不同（如果我理解您的示例正确），因为您在路由器级别获得了一个大型模型，并希望每个子元素都能看到它的一部分。我已委派每个较低级别的元素，以便在路由器告知时获取模型的一部分。但是你的核心问题，即刺激较低层次的问题已得到解决。

我刚刚开始将它构建到我的项目中（之前我使用的是page.js，但我正在努力解决它如何触发铁页，这就是我构建路由器的原因）。但测试工具确实显示它正在完成工作。

如何在我的视图模型周围构建Polymer SPA和核心页面？

1 个答案: