elementUi内置过渡动画(淡入)-飞外

使用方法:

在要使用该淡入效果的标签外层嵌套 transition 标签,并添加name属性,属性值为el-fade-in-linear 或 el-fade-in

例子:

 template  div  el-button  @click="fadeIn()" 淡入 /el-button  div  !-- 在transition标签里添加对应的name --  !-- 淡入方式1:el-fade-in-linear --  transition   div v-show="show" el-fade-in-linear /div  /transition  !-- 淡入方式2:el-fade-in --  transition   div v-show="show" el-fade-in /div  /transition  /div  /div  /template  script export default { name: "HelloWorld", data() { return { show: true methods: { fadeIn() { this.show = !this.show; /script  style lang="css" scoped .box { display: inline-block; width: 200px; height: 200px; background-color: skyblue; margin-top: 20px; color: #fff; text-align: center; line-height: 200px; margin-right: 20px; /style