3.v-bind

v-bind是用来绑定标签与数据的指令(给标签属性设置值)

<style>
        .BLUE {
            background: pink;
        }
    </style>

<div id="vbind">
    <!-- BLUE是名字,blue是值 -->
    <a v-bind:class="{BLUE: blue}" v-bind:href="url[0]">百度</a>
    <a v-bind:href="url[1]">搜狗</a>
</div>

new Vue({
    el: '#vbind',
    data: {
        url: ['http://baidu.com', 'https://www.sogou.com'],
        blue: true,
    }
});

v-bind 可以省略不写

<a :class="{BLUE: blue}" :href="url[0]">百度</a>
    <a :href="url[1]">搜狗</a>