elementUi内置过渡动画（淡入）

elementUi 元素淡入的方式有两种：

1.el-fade-in-linear  

2.el-fade-in

使用方法：

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

例子：

 <template>
  <div>
    
    <el-button type="primary" @click="fadeIn()">淡入el-button>

    <div class="ctn">
      
      
      <transition name="el-fade-in-linear">
        <div class="box" v-show="show">el-fade-in-lineardiv>
      transition>

      
      <transition name="el-fade-in">
        <div class="box" v-show="show">el-fade-indiv>
      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>