vul里的v-on:click(事件名)="alt"

2018-09-14  本文已影响0人  greenPLUS
<body>
<div id="itany">
    <p>{{msg}}</p>
    <button v-on:click="alt">按钮</button>//点击这个按钮出现“alt”函数的内容
</div>


<script src="dist/vue.js"></script>
<script>
    new Vue({
        el:'#itany',
        data:{
            msg:'hello'
        },
        methods:{
            alt:function(){
                this.msg='hello kugou'
            }
        }
    })
</script>
</body>

用v-on写一个点击转换文字的效果

<body>
<div id="teyle">
    <p>{{msg}}</p>
    <button v-on:click="alt">按钮</button>
</div>
<script src="dist/vue.js"></script>
<script>
    new Vue({
        el:'#teyle',
        data:{
            msg:'hello kugou',
            txt:true
        },
        methods:{
            alt:function(){
                if (this.txt){
                    this.msg='你好,酷狗',
                    this.txt=false
                }else {
                    this.msg='hello kugou',
                    this.txt=true
                }
            }
        }
    })
</script>
</body>
上一篇 下一篇

猜你喜欢

热点阅读