Min's blog

I choose to see the beauties in the world.

导航

vue808

Posted on 2017-08-08 11:19  Min77  阅读(147)  评论(0编辑  收藏  举报

自定义键盘信息:
    Vue.directive('on').keyCodes.ctrl=17;
    Vue.directive('on').keyCodes.myenter=13;

 

数据深度监听

vm.$watch('a',function () {
alert('a变了')
},{deep:true});



npm info (包名) 包的版本信息
npm install (包名)@版本号
clear 清屏

vue动画
<transition name="fade">
<div id="div1" v-show="sign"></div>
</transition>



css:
.fade-enter-active,.fade-leave-active {
transition: all 1s ease
}
.fade-enter{
opacity:0;
}
.fade-leave-active{
opacity:0;
}
 
animate.css动画:
Bounce

bounce
bounceDown
bounceLeft
bounceRight
bounceUp
Fade

fade
fadeDown
fadeDownBig
fadeLeft
fadeLeftBig
fadeRight
fadeRightBig
fadeUp
fadeUpBig


rotate
rotateDownLeft
rotateDownRight
rotateUpLeft
rotateUpRight
Slide

slideDown
slideLeft
slideRight
slideUp
Zoom

zoom
zoomDown
zoomLeft
zoomRight
zoomUp

结合animate.css
<div id="box">
<input type="button" value="press" @click="toggle">
<transition name="bounce" enter-active-class="zoomInLeft" leave-active-class="zoomOutRight">
<div id="div1" v-show="sign" class="animated" ></div>
</transition>

<transition-group enter-active-class="zoomInLeft" leave-active-class="zoomOutRight">
<p v-show="sign" class="animated" :key="1"></p>
<p v-show="sign" class="animated" :key="2"></p>
</transition-group>
</div>