关于前端:VUE中动态设置CSS3-animation动画属性不生效

想通过设置动静style的形式设置设置animation属性，发现动静设置的animation动画没有通过Vue本人的编译（可能）

在class中定义的animation是有哈希的
间接通过style设置的animation是没有哈希的

解决方案一

删除scoped，不举荐，会净化全局

解决方案二

this.dymanicStyle = `@keyframes add-bezier {
    from {transform: translateX(0px)}
    to {transform: translateX(280px)}
}`
let sheet = document.styleSheets[0]
sheet.insertRule(this.dymanicStyle, 0)

在styleSheets中退出@keyframes

<div class="box" ref="box"></div>



this.$refs.box.style.animation = 'add-bezier 1s'

通过ref间接操作dom，将animation增加下来