1、使用this.$emit 子组件向父组件传递事件以及携带数据

    这里的titleHandle是监听子组件传递过来的事件(带有参数)，showTitle是父组件监听成功之后在父组件内执行的方法，【注意这里@titleHandle = "showTitle"的showTitle后面不能加()，里面也不能传参】子组件：methods:{    getTitle(title){        this.$emit('titleHandle',title)    }},父组件：methods: {    showTitle(title){        console.log(title)    }},

2、在vue组件内，如果要对组件内的数据做逻辑判断，那么这个逻辑应该写在计算属性computed内，一般不放在模板内

computed:{    num(){ //在模板里面直接{
   {num}}即可        return ...   //这里面对值做逻辑处理、筛选等等    }}

3、使用CSS3 animation模拟gif动画

.love {    display: block;    width: 100px; height: 100px;    background: url(web_heart_animation.png) 0 0 no-repeat;    background-size: 2900%;    animation: heart-burst steps(28) 0.8s infinite both;}.stop {    animation-play-state: paused;}@keyframes heart-burst {  //图片从左到右一字排开，有多少个，steps里面就写几  0% {    background-position: 0%;  }  100% {    background-position: 100%;  }}HTML代码：
JS代码：var image = document.getElementById("testImg"),     button = document.getElementById("testBtn");if (image.classList && image && button) {    button.onclick = function() {        if (this.value == '暂停') {            image.classList.add('stop');            this.value = '播放';        } else {            image.classList.remove('stop');            this.value = '暂停';        }    };}
        
    
     兔斯基 卖萌