vue 中怎么动态给标签加css

一、Vue css过渡的基本语法

<div v-if="show" :transition="expand">hello</div>

然后耐帆为 .expand-transition, .expand-enter 和 .expand-leave 添加 CSS

/* 必需 */

.expand-transition {

transition: all .3s ease

height: 30px

padding: 10px

background-color: #eee

overflow: hidden

}

/* .expand-enter 定义神亩橡进入的开始状态 */

/* .expand-leave 定义离开的结束状态 */

.expand-enter, .expand-leave {

height: 0

padding: 0 10px

opacity: 0

}

你可以在同一元素上通过动态绑定实现不同的过渡：游旁

<div v-if="show" :transition="transitionName">hello</div>

new Vue({

el: '...',

data: {

show: false,

transitionName: 'fade'

}

})

如图是一个常见的vue文件结构

在app.html 或者*.vue中引入陆腔郑css，如下所示：

在 app.html引入css对阵个页圆散面都生早颂效，在vue文件中引入，只对改vue生成的页面有效

---