javascript - Polymer 2.0 - dom-repeat - 简单动画

标签 javascript polymer polymer-2.x neon-animation

我在 Polymer 2.0 中构建了一些组件,在这个组件中,我在 dom-if 中具有 dom-repeat block 。有没有简单快速的方法可以在打开和关闭此 repat block 时添加一些动画?

这是我的代码:

<template id="drop-down-list-container" is="dom-if" if="{{_isDropDownOpen}}">
        <div id="drop-down-list">
            <template is="dom-repeat" items="{{itemsTitles}}">
                <button on-click="_onDropDownItemClick" class="button-style items">{{item}}</button>
            </template>
        </div>
    </template>

当 _isDropDownOpen 更改状态时,我想要一些简单的动画 -> 从 0 到 1 - 进入动画,从 1 到 0 关闭动画。添加这个很简单吗?我应该使用 NEON 动画吗?

最佳答案

为什么不使用铁塌陷,它有动画构建,请参见 iron-collapse

关于javascript - Polymer 2.0 - dom-repeat - 简单动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43997675/

相关文章:

javascript - 如何管理大型 JavaScript 数据文件?

javascript - Polymerfire 谷歌验证不工作

javascript - Polymer 中的横向通信

javascript - polymer 2.0 : why do we need an anonymous function when imperatively adding listener

microsoft-edge - Webcomponents polyfills 在 Edge 上失败

javascript - Webcomponents polymer 元素不可见

javascript - 使用 javascript 正则表达式查找第一个和最长的匹配项

javascript - 如何使用 Javascript 获取移动元素的新偏移量?

javascript - 向 URL 添加参数?

dart - 由于观察到的属性而更新 DOM 后是否会触发事件?