Question

我失去了继承项目的工作：Java应用程序的Web前端，在服务器上提供数据。它包含许多未修复的错误，大部分可能是从迁移到Polymer 1.0，这是前端工作人员在离开之前做的最后一件事。到目前为止，我已将所有npm和bower依赖项更新到其最新版本，并查看了自定义HTML和JavaScript部分中发生的大部分内容，但我只知道一些基本的HTML和Java无助于推动前进。

该区域的HTML结构大致如下：

<paper-scaffold id="scaffold" drawer-width="{{drawerWidth}}" responsive-width="{{responsiveWidth}}" mlist="{{mList}}> 
    <neon-animated-pages id="pages-blocks" class="flex" selected="{{selectedPage}}" entry-animation="{{entryAnimation}}" exit-animation="{{exitAnimation}}"> 
        <template is="dom-repeat" items="{{list}}" as="block" index-as="blockIndex">
            <neon-animatable> (content) </neon-animatable>
        </template>
    <neon-animated-pages>
</paper-scaffold>

（<paper-scaffold>是源自<core-scaffold>的自定义脚手架。）

整个装置在大多数情况下按预期工作 - 您单击列表中的项目以选择它们，并使相应服务器对象的内容显示在前端的其他位置 - 除了列表中的第一个条目。它是这样的：

第一项被选中并正常处理
一旦您尝试选择另一个项目，在第一个项目之后选择保持不变并且在neon-animated-pages.html中引发错误： Uncaught TypeError: Cannot read property 'classList' of undefined。
点击另一个项目会解除选择（尽管再次抛出错误）
从那时起，每一件事都恢复正常，直到再次选择第一个街区

抛出错误的一行是在霓虹动画页面＆＃39; _selectedChanged函数观察变量selected，该变量随每次点击选择一个新项目而变化。它写着：

selectedPage.classList.add('neon-animating');

所以我去监视变量selectedPage，看来项目列表上的点击发生了相当多的事情。

当从除第一项以外的任何项目切换到另一项（包括第一项）时，_selectedChanged被调用三次：

selectedPage未定义，但函数退出，因为它确实存在找不到以前选择的导致其停止的页面
selectedPage是预期的[对象HTMLElement]，函数完成且没有错误
selectedPage未定义，但函数退出，因为它找不到导致其停止的先前选定的页面

从第一个项目切换到另一个项目时，_selectedChanged被调用三次：

selectedPage是一个[对象HTMLElement]预期三次，函数完成且没有错误

从第一个之后选择的项目切换到任何其他项目时，_selectedChanged会被调用一次：

selectedPage未定义但前一页已知，错误被抛出

当从该项目切换到另一个项目时，它看起来与正常项目相同（三次调用，两次未定义）并按预期工作，但无论如何都会抛出错误。

我可以找到selectedPage未定义的唯一其他实例是this issue report on "more-routing"，但此前端没有路由发生。

我很抱歉，如果这一切都非常复杂，但我只是刚开始研究网络开发和聚合物，甚至找不到开始调试的地方，因为这样的事情似乎发生在我无法触及的范围之外。霓虹动画页面使用的所有变量都没有被＆＃34;我的＆＃34;码。我很乐意提供任何可能有助于解决此问题的其他信息。

Answer 1

这本身并不是一个答案，但我想我至少会留下一些见解以防万一有人绊倒这个问题。

发生的事情是，在我继承的代码混乱中，_selectedChanged上的三个调用来自三个不同的<neon-animated-pages>个实例，它们共享相同的索引，通常只有（通常）其中一个可见。他们都互相干扰和代码的其他部分，并且在某些时候我忘记跟踪连接以修复它们。

我的解决方案＆＃34;在没有动画的情况下重写代码，无论如何都没有必要，事实上，我们想把它关掉。现在，一个更加纤薄（和注释）的<paper-drawer-panel>构造连接列表和内容。

Polymer neon-animated-pages抛出TypeError，因为其selectedItem未定义

1 个答案: