手機也能上課
1/10
指令
指令 (Directives) 是帶有 v-
前綴的特殊特性。指令特性的值預期是單個 JavaScript 表達式 (v-for
是例外)。
指令的職責是,當表達式的值改變時,將其產生的連帶影響,響應式地作用于 DOM。
例如:
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<div id="app">
<p v-if="seen">現(xiàn)在你看到我了</p>
</div>
<script>
var vm = new Vue({
el:'#app',
data:{
seen: 1
}
});
setTimeout(()=>{
vm.seen=0;
}, 2000)
</script>
運行結果:
這里,v-if
指令將根據(jù)表達式 seen
的值的真假來插入/移除 <p>
元素。
參數(shù)
一些指令能夠接收一個“參數(shù)”,在指令名稱之后以冒號表示。例如,v-bind
指令可以用于響應式地更新 HTML 特性:
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<div id="app">
<a v-bind:href="url">w3cschool</a>
</div>
<script>
var vm = new Vue({
el:'#app',
data:{
url: 'https://m.w3cschool.cn'
}
});
</script>
結果: