v-bind 属性值绑定

<a v-bind:href="url" target="_blank">Baidu</a>

通过将 v-bind: 添加在某个属性前，可以将该属性的值绑定为 app 中的数据。通常我们会用其简写形式，仅保留冒号：

<a :href="url" target="_blank">Baidu</a>

对应的js代码：

const vm = Vue.createApp({
    data() {
        return {
            firstName: 'John',
            lastName: 'apple',
            url: "http://baidu.com/"
        }
    },
    methods: {
        fullname() {
            return `${this.firstName} ${this.lastName.toUpperCase()}`
        }
    }
}).mount("#app")

相关

v-model 数据绑定 实际上就是由 v-bind 属性值绑定 和 v-on 事件监听 组合起来的语法糖，一下两种写法是等价的：

<input type="text" :value="firstName" @input="updateFirstName" />
<input type="text" v-model="firstName" />