Vue学习篇(二):Vue初使用:双大括号与v-on指令

用双大括号括起变量,是从Vue中的data获取数据的标识

<div id="app">
    <input type="text" v-on:input="changeName"> <!--使用指令v- -->
    <h1>{{name}}</h1>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    new Vue({
        el:"#app",
        data:{
            name:"ccy"
        }, // 变量均存储在data中
        methods:{
            changeName: function(e){
                this.name = e.target.value;
            }
        } // 方法均存储在methods中
    })
</script>

效果:
h1的初始内容是:ccy,
当文本框输入内容时,h1的内容随着文本框内容的改变而改变
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值