Vue：高頻指令（完結）

完結時間：2021年4月13日

星辰_部落格目錄

• v-bind:屬性
• v-on:事件
• v-model
• v-html/v-text

本文按照指令使用頻率高—>低排版

v-bind:屬性

• 作用：将标簽屬性變成動态屬性，也就是在屬性值可以使用變量了。

<img :src="imgsrc" />  //常用簡寫
<img v-bind:src="imgsrc" />
// imgsrc為一個變量
           

v-on:事件

• 作用：為标簽綁定事件

<button @click="">點選事件</button>  // 常用簡寫
<button v-on:click="">點選事件</button>
           

v-model

• 作用：表單控件的value與變量雙向綁定

<input type="text" v-model="inputTxt">
// 使用v-model替代value，inputTxt是一個變量
           

v-html/v-text

• 作用：富文本、普通文本渲染，相當于innerHTML，innerText