Vue练习四十三:05_08_div闪烁

Demo 在线地址:
https://sx00xs.github.io/test/43/index.html
---------------------------------------------------------------
ide: vscode
文件格式:.vue
解析:(待补)

<template>
    <div class="box" ref="myDiv"
    @click="handleClick"
    >点击我就闪</div>
</template>
<script>
import { clearInterval, setInterval } from 'timers';
export default {
    name:'Navs',
    data(){
        return{
            
        }
    },
    methods:{
        handleClick(){
            var i=0;
            var timer=null;
            var el = this.$refs.myDiv;
            clearInterval(timer);
            timer = setInterval(function(){
                el.style.display = i++ % 2 ? 'none' : 'block';
                i > 6 && (clearInterval(timer))
            },80)
        }
    }
    
}
</script>

 

posted @ 2019-07-29 20:22  sx00xs  阅读(131)  评论(0编辑  收藏  举报