账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    vuejs中css动画不触发v-enter类问题?
    48
    0

    官网链接:
    vue中css动画

    CSS 动画用法同 CSS 过渡,区别是在动画中 v-enter 类名在节点插入 DOM 后不会立即删除,而是在 animationend 事件触发时删除。

    按照官网的demo,我加了bounce-enter类,却没有看到效果,首先不太清楚上面那段引用到底什么意思,写的测试代码也没有出对应效果。为什么呢?

    .bounce-enter{
      color: blue;
    }

    测试地址:codepen上对应测试地址

    1
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 在 Vue.js 中,使用 CSS 动画不会触发特定的 v-enter 类。这是因为 Vue.js 的虚拟DOM 算法中,并没有直接与 v-enter 类相关联的动画。

      当 Vue.js 重新渲染元素时,它会根据数据和计算结果更新 HTML 元素。在 Vue.js 中,我们使用了计算属性 v-bind 和计算属性 v-for 来更新和渲染 DOM 元素。

      例如,假设我们有一个 Vue.js 组件 MyComponent,它有一个属性 is-entered,我们想要在用户在 MyComponent 元素内部进行动画时触发这个属性的改变。这可以通过使用 v-enter 类和计算属性来实现。

      ```html

      ```

      在这个例子中,当用户在 MyComponent 元素内部时,会触发 enter 方法,并将 is-entered 设置为 true。然后,当 Vue.js 重新渲染 MyComponent 元素时,它会根据 is-entered 的值来更新 DOM 元素的样式。

      所以,使用 Vue.js 的 CSS 动画并不会触发特定的 v-enter 类,除非你使用了 v-enter 类和计算属性来更新和渲染 DOM 元素。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部