使用Vue做出跑马灯效果

 <div id="pmd">

        <h4> {{msg}}</h4>

        <input type="button" value="动起来" @click="run">

        <input type="button" value="停下" @click="stop">

    </div>

    <script>

        var pmd = new Vue({

            el: '#pmd',

            data:{

                msg:'动起来吧！跑马灯~~！',

                IntervalId: null

            },

            methods:{

                run(){

                    if (this.IntervalId != null)return;

                    this.IntervalId = setInterval( () =>{

                        var start = this.msg.substring(0,1)

                        var end = this.msg.substring(1)

                        this.msg = end + start

                    }, 300)

            },

            stop(){

                clearInterval(this.IntervalId),

                this.IntervalId = null

            },

        }

        })

    </script>