vue-动态加,以及过渡与动画

1.Vue动态加载对象属性(重点)
Vue中,如果对象中存的属性没有变化,那么就不能检测新增或删除的属性
当向对象中加入新属性

需用 Vue.$set方式设置

格式:
单条添加: this.$set(对象,属性名,属性值)例:this.$set(this.user,‘age’,20);

多条添加: Object.assign({},vue属性,{批量属性} )
例: this.user = Object.assign({},this.user,{
age:20,
phone:1760019****
})
2. vue中的过渡与动画
利用vue去操控css的transition/animation动画
模板: 使用包含带动画的标签
css样式
.选择器-enter-active: 进入过程, 指定进入的transition
.选择器-leave-active: 离开过程, 指定离开的transition
.选择器-enter, .xxx-leave-to: 指定隐藏的样式

编码例子

   显示与离开默认样式
    .a-enter, .a-leave-to {
      opacity: 0
    }

	.a-enter-active, .a-leave-active {
      transition: opacity .5s
    }

Ps:过渡结束后,恢复开始调置时的样式

    <transition name="xxx">
      <p v-if="show">hello</p>
    </transition>