vue指令

v-bind

目標(biāo): 給標(biāo)簽屬性設(shè)置vue變量的值

語(yǔ)法：v-bind:屬性名="vue變量"
簡(jiǎn)寫(xiě)：:屬性名="vue變量"

<template>
  <div id="app">
    <h1>{{msg}}</h1>
    <h2>{{ obj.name }}</h2>
    <h3>{{ obj.age > 18 ? '成年' : '未成年' }}</h3>
  <img v-bind:src="img" alt="">
  <a v-bind:href="url">點(diǎn)我</a>
  <!-- v-bind可以省略 -->
  <img :src="img" alt=""> 
  <a :href="url">點(diǎn)我</a>
  </div>
</template>

<script>
export default {
  data () {
    return {
      msg:"你好呀!",
      obj: {
        name: "小vue",
        age: 5
      },
      img:"https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png",
      url:"http://www.baidu.com"
    }
  }
}
// console.log(1234566);
</script>

<style scoped>

</style>

目標(biāo):用v-bind給標(biāo)簽class設(shè)置動(dòng)態(tài)的值

語(yǔ)法 :class="{類名: 布爾值}" ,true使用, false不用

<template>
  <div>
    <button v-on:click="bool=!bool">切換類名</button>
    <div :class="{redClass:bool}">動(dòng)態(tài)綁定class</div>
  </div>
</template>

<script>
export default {
  data () {
    return {
     bool:true
    }
  },
  
}
</script>
<style scoped>
.redClass{
  color: red;
}
</style>

目標(biāo):給標(biāo)簽動(dòng)態(tài)設(shè)置style的值

語(yǔ)法 :style="{css屬性名: 值}"

<template>
  <div>
    <button @click="colorStr='green'">變成綠色</button>
    <button @click="colorStr='blue'">變成藍(lán)色</button>
    <button @click="colorStr='red'">變成紅色</button>
    <div :style="{color:colorStr,fontSize:'80 px'}">動(dòng)態(tài)綁定 style</div>
  </div>
</template>
<script>
export default {
  data () {
    return {
    //設(shè)置默認(rèn)顏色
     colorStr:'red'
    }
  },
  
}
</script>

<style scoped>

</style>

v-on

目標(biāo): 給標(biāo)簽綁定事件

語(yǔ)法
- v-on:事件名="要執(zhí)行的==少量代碼=="
- v-on:事件名="methods中的函數(shù)"
- v-on:事件名="methods中的函數(shù)(實(shí)參)"
簡(jiǎn)寫(xiě): @事件名="methods中的函數(shù)"

<template>
  <div>
    <h1>當(dāng)前數(shù)量:{{count}}</h1>
    <button v-on:click="()=>{count+=1}">點(diǎn)擊</button>
      <!--簡(jiǎn)寫(xiě)-->
    <button v-on:click="count=count+=1">點(diǎn)擊</button>
    <h1>當(dāng)前金額:{{money}}</h1>
    <!-- 簡(jiǎn)寫(xiě) -->
    <button v-on:click="money+=10">點(diǎn)擊</button>
  </div>
</template>

<script>
export default {
  data () {
    return {
      count:1,
      money:10
    }
  }
}
</script>

<style scoped>

</style>

v-on事件對(duì)象

語(yǔ)法:

無(wú)傳參, 通過(guò)形參直接接收
傳參, 通過(guò)$event指代事件對(duì)象傳給事件處理函數(shù)

<template>
  <div>
    <h1>當(dāng)前數(shù)量:{{count}}</h1>
    <button v-on:click="()=>{count+=1}">點(diǎn)擊</button>
    <!-- 簡(jiǎn)寫(xiě) -->
    <button v-on:click="addFn">點(diǎn)擊觸發(fā)add</button>
    <button v-on:click="addFncount(-10)">減少10個(gè)</button>
    <!-- 增加10 -->
    <!-- v-on: 簡(jiǎn)寫(xiě)用  @ 替代 -->
    <button @click="addFncount(10)">增加10個(gè)</button>
  </div>
</template>

<script>
export default {
  data () {
    return {//返回的其實(shí)是一個(gè)對(duì)象
      count:1,
    }
  },
  methods:{
addFn(){
  console.log("點(diǎn)擊觸發(fā)add");
  this.count+=1
},
// 帶參數(shù)的寫(xiě)法
addFncount(num){
  this.count+=num 
}
  },
}
</script>

<style scoped>

</style>

v-on修飾符

語(yǔ)法:

@事件名.修飾符="methods里函數(shù)"
- .stop - 阻止事件冒泡
- .prevent - 阻止默認(rèn)行為
- .once - 程序運(yùn)行期間, 只觸發(fā)一次事件處理函數(shù)

<template>
  <div>
<h1>事件修飾符</h1>
<div class="box" @click="faterFn">父元素</div>
  <!-- .stop阻止事件冒泡 -->
  <button @click.stop="btn">.stop阻止事件冒泡</button>
  <!-- .prevent阻止默認(rèn)事件 -->
  <!-- 可以同時(shí)多個(gè)事件一起 阻止默認(rèn)+阻止冒泡 -->
  <a  @click.prevent.stop="btn3">.prevent阻止事件冒泡</a>
  <button @click.once="btn">.once程序運(yùn)行期間,只觸發(fā)一次事件處理函數(shù)</button>

  </div>
</template>

<script>
export default {
  methods:{
    faterFn(){
      console.log("faterFn被點(diǎn)擊了");
    },
    btn(){
      console.log(111);
    },
    btn3() {
      console.log("被點(diǎn)擊了,但是沒(méi)有跳轉(zhuǎn),設(shè)置了阻止默認(rèn)行為");
    }, 
  }

}
</script>

<style scoped>

</style>

v-on按鍵修飾符

語(yǔ)法:

@keyup.enter - 監(jiān)測(cè)回車按鍵
@keyup.esc - 監(jiān)測(cè)返回按鍵
@keyup.字母 - 監(jiān)測(cè)返回對(duì)應(yīng)的字母按鍵

<template>
  <div>
    <input type="text" @keydown.enter="enterFn" placeholder="enter鍵觸發(fā)" />
    <hr />
    <!-- 修飾符只能小寫(xiě)字母 -->
    <!-- 但是鍵盤(pán)輸入大小寫(xiě)都能觸發(fā)事件 -->
    <input type="text" @keydown.a="aFn" placeholder="a鍵觸發(fā)" />
    <hr />
    <input type="text" @keydown.K="KFn" placeholder="k鍵觸發(fā)" />
  </div>
</template>

<script>
export default {
  methods: {
    enterFn() {
      console.log("按下enter鍵");
    },
    aFn() {
      console.log("按下a鍵");
    },
    KFn() {
      console.log("按下K鍵");
    },
  },
};
</script>

<style scoped>
</style>

v-model

語(yǔ)法: v-model="vue數(shù)據(jù)變量"
雙向數(shù)據(jù)綁定
- 數(shù)據(jù)變化 -> 視圖自動(dòng)同步
- 視圖變化 -> 數(shù)據(jù)自動(dòng)同步

<template>
  <div>
<h1>v-model雙向數(shù)據(jù)綁定</h1>
用戶名<input type="text" v-model="username">
密碼<input type="password" v-model="password">
<button @click="loginBtn">登錄</button>
  </div>
</template>

<script>
export default {
  data () {
    return{
      username:"匿名用戶",
      password:"123456"
    
  },
  methods:{
    loginBtn(){
      console.log("用戶名:",this.username);
      console.log("密碼:",this.password);
    }
  }

}
</script>

下拉菜單寫(xiě)在select,value在option上

<template>
  <div>
# 注意-model是給select標(biāo)簽綁定,value在option上   
    <div>
      <select v-model="city">
        <option value="廣州">廣州</option>
        <option value="上海">上海</option>
        <option value="杭州">杭州</option>
        <option value="北京">北京</option>
        <option value="深圳">深圳</option>
      </select>
    </div>
    <!-- 復(fù)選框 -->
    <div>
      <label
        ><input
          type="checkbox"
          name=""
          value="唱歌"
          v-model="hobby"
        />唱歌</label
      >
      <label
        ><input
          type="checkbox"
          name=""
          value="爬山"
          v-model="hobby"
        />爬山</label
      >
      <label
        ><input
          type="checkbox"
          name=""
          value="睡覺(jué)"
          v-model="hobby"
        />睡覺(jué)</labe
      >
      <label
        ><input
          type="checkbox"
          name=""
          value="吃飯"
          v-model="hobby"
        />吃飯</label
      >
    </div>
    <!-- 單選框 -->
    <div>
      <label><input type="radio" value="男" v-model="gender" />男</label>
      <label><input type="radio" value="女" v-model="gender" />女</label>
    </div>
    <div>
      <!-- 自我介紹 -->
      <!-- 失去焦點(diǎn)再收集數(shù)據(jù) -->
      <textarea v-model.lazy="intro"></textarea>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      // 下拉框默認(rèn)城市
      city: "廣州",
      // 設(shè)置為具體某個(gè)就["吃飯"]
      // 復(fù)選框收集多個(gè)數(shù)據(jù),初始值要設(shè)置為數(shù)組
      hobby: [],
      // 單選框默認(rèn)性別
      gender: "男",
      // 自我介紹
      intro: "",
    };
  },
};
</script>

v-model用在復(fù)選框時(shí),v-model的vue變量分兩種

# 非數(shù)組 – 關(guān)聯(lián)的是checked屬性
# 數(shù)組  – 關(guān)聯(lián)的是value屬性
<template>
  <div><input type="checkbox" checked="text" v-model="text" />學(xué)習(xí)</div>
</template>

<script>
export default {
  data() {
    return {
    //text: true,
      text: "",
    };
  },
};
</script>

v-model修飾符

語(yǔ)法: v-model.修飾符="Vue數(shù)據(jù)變量"

# .number  以parseFloat轉(zhuǎn)成數(shù)字類型
# .trim     去除字符串首尾空白字符
# .lazy     失去焦點(diǎn)后才收集數(shù)據(jù)(change)而非inupt時(shí)
<template>
  <div>
    <input type="text" v-model.trim="username" />
    <input type="text" v-model.number="age" />
    <textarea name="" id="" cols="30" rows="10" v-model.lazy="text"></textarea>
  </div>
</template>

<script>
export default {
  data() {
    return {
      username: "哈哈哈",
      age: 18,
      text: "",
    };
  },
};
</script>

v-text/v-html

語(yǔ)法:

v-text="vue數(shù)據(jù)變量"
v-html="vue數(shù)據(jù)變量"

<template>
  <div>
    <p v-text="str"></p>
    <p v-html="str"></p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      str: "<span>我是一個(gè)span標(biāo)簽</span>"
    }
  }
}
</script>

v-show/v-if

語(yǔ)法:

v-show="vue變量"
v-if="vue變量"

原理

v-show 用的display:none隱藏 (頻繁切換使用)
v-if 直接從DOM樹(shù)上移除
v-if可以配合v-else或者v-else-if使用

高級(jí)

v-else的使用

<template>
  <div>
#    <!-- true的看的見(jiàn) -->
#    <!-- v-show后可接變量再去給變量設(shè)置布爾值,也可直接接布爾值 -->
    <h1>v-show后可接變量,也可直接接布爾值</h1>
    <h1 v-show="true">這是v-show的盒子接布爾值</h1>
    <h1 v-show="isok">這是v-show的盒子接變量</h1>
    <button @click="isok = !isok">顯示或隱藏接變量的</button>
#    <!-- 寫(xiě)成事件型 -->
    <button @click="btnFn">顯示或隱藏接變量的</button>
#    <!-- false 看不見(jiàn) -->
    <h1 v-if="isNo">v-if的盒子</h1>

    <div>
 #     <!-- 判斷語(yǔ)句 -->
 #     <!-- 如果滿足age>18就輸出v-if的,不滿足的就輸出v-else -->
      <p v-if="age > 18">滿18啦</p>
      <p v-else>18都沒(méi)有</p>
 #    v-show 讓盒子顯示或隱藏 display:none 
 #     v-if   讓盒子創(chuàng)建或者刪除  性能開(kāi)銷更大
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      //
      isok: true,
      isNo: false,
      age: 20,
    };
  },
  methods: {
  
    btnFn() {
#     取反
      this.isok = !this.isok;
    },
  },
};
</script>

v-if 和v-else

<template>
  <div>
    <button v-on:click="isShow = !isShow">切換狀態(tài)</button>

    <ul v-if="isShow">
      <li>1</li>
      <li>2</li>
      <li>3</li>
    </ul>
#  v-else書(shū)寫(xiě)需要和v-if同級(jí) 
#  v-else和v-if互斥
#  應(yīng)用場(chǎng)景: 列表狀態(tài)與空狀態(tài)切換,加載狀態(tài)切換
    <div v-else>空狀態(tài)</div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      isShow: false,
    };
  },
};
</script>

v-for

語(yǔ)法:

v-for="(值變量, 索引變量) in 目標(biāo)結(jié)構(gòu)"
v-for="值變量 in 目標(biāo)結(jié)構(gòu)"

目標(biāo)結(jié)構(gòu):

可以遍歷數(shù)組 / 對(duì)象 / 數(shù)字 / 字符串 (可遍歷結(jié)構(gòu))

注意:

v-for的臨時(shí)變量名不能用到v-for范圍外

<template>
  <div>
    <h1>列表渲染 v-for</h1>
    <ul>
#           v-for="值變量 in 目標(biāo)結(jié)構(gòu)"
#           :key ="唯一標(biāo)識(shí)"

      <li v-for="item in arr" :key="item">{{ item }}</li>
      <!-- 注意:v-for的臨時(shí)變量不能用到v-for范圍外 -->
    </ul>
    <button @click="btn">11</button>
  </div>
</template>
<script>
export default {
  data() {
    return {
      arr: ["劉備", "關(guān)羽", "張飛"],
    };
  },
  methods: {
    btn() {
#    重復(fù)添加就會(huì)報(bào)錯(cuò),出現(xiàn)重復(fù)鍵---key得唯一
      this.arr.push("11");
    },
  },
};
</script>

帶下標(biāo)的

#           v-for="(值變量,下標(biāo)) in 目標(biāo)結(jié)構(gòu)"
<template>
  <div>
    <h1>列表渲染 v-for</h1>
    <ul>
      <li v-for="item in arr" :key="item">{{ item }}</li>
    </ul>
    <h1>獲取下標(biāo)(索引)</h1>
    <ul>
      <li v-for="(item, index) in arr" :key="item">{{ item }}---{{ index }}</li>
    </ul>
    <h1>數(shù)組的每一項(xiàng)是對(duì)象--項(xiàng)目常見(jiàn)</h1>
    <ul>
      <li v-for="(item, index) in arrObj" :key="item">
        {{ item.id }}----{{ index }}
      </li>
    </ul>
  </div>
</template>
<script>
export default {
  data() {
    return {
      arr: ["劉備", "關(guān)羽", "張飛"],
      arrObj: [
        { id: "1", name: "劉備" },
        { id: "2", name: "曹操" },
        { id: "3", name: "孫權(quán)" },
      ],
    };
  },
};
</script>

其他的使用

# key的要求:唯一不重復(fù)的字符串或者數(shù)值
<template>
  <div>
    <h1>列表渲染 v-for</h1>
    <h2>遍歷對(duì)象</h2>
    <div>
      <ul>
        <li v-for="(value, key) in obj" :key="key">{{ key }} : {{ value }}</li>
      </ul>
    </div>
    <h2>遍歷數(shù)字</h2>
    <div>
      <ul>
        <li v-for="item in 10" :key="item"></li>
      </ul>
    </div>
    <h1>數(shù)組的每一項(xiàng)是對(duì)象--項(xiàng)目常見(jiàn)</h1>
    <div>
      <ul>
        <!-- :key=item 報(bào)錯(cuò),因?yàn)闆](méi)有唯一   :key要唯一標(biāo)識(shí) -->
        <li v-for="(item, index) in list" :key="item.id">
          {{ item.id }}----{{ index }}
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      obj: {
        username: "哈哈",
        age: "18",
        sex: "女",
      },
      arr: ["劉備", "關(guān)羽", "張飛"],
      list: [
        { id: "1", name: "諸葛亮" },
        { id: "2", name: "曹操" },
        { id: "3", name: "孫權(quán)" },
      ],
    };
  },
};
</script>

v-for更新監(jiān)測(cè)

# 數(shù)組采用會(huì)改變?cè)紨?shù)據(jù)的更新方法, 才導(dǎo)致v-for更新頁(yè)面
# 這些方法會(huì)觸發(fā)數(shù)組改變, v-for會(huì)監(jiān)測(cè)到并更新頁(yè)面
push()
pop()
shift()
unshift()
splice()
sort()
reverse()

#  這些方法不會(huì)觸發(fā)v-for更新
slice()
filter()
concat()
# 注意: vue不能監(jiān)測(cè)到數(shù)組里賦值的動(dòng)作而更新, 如果需要請(qǐng)使用Vue.set() 或者this.$set(), 或者覆蓋整個(gè)數(shù)組

<template>
  <div>
    <button v-on:click="btn01">點(diǎn)擊翻轉(zhuǎn)</button>
    <button v-on:click="btn02">截取前兩位</button>
    <button v-on:click="btn03">將第一位修改為其他值</button>
    <h1>請(qǐng)選擇喜歡的項(xiàng)目</h1>
    <label v-for="item in arr" :key="item">
      <input type="checkbox" v-model="hobby" v-bind:value="item" />{{ item }}
    </label>
    <h2>選中的列表</h2>
    <ul>
      <li v-for="item in hobby" :key="item">{{ item }}</li>
    </ul>
  </div>
</template>
<script>
export default {
  data() {
    return {
      arr: ["科幻", "喜劇", "動(dòng)漫", "冒險(xiǎn)", "科技", "軍事", "娛樂(lè)", "奇聞"],
      hobby: [],
    };
  },
  methods: {
    btn01() {
      this.arr.reverse();
    },
    btn02() {
      // this.arr.slice(0, 2)這樣是不會(huì)直接影響到原數(shù)組的,所以重新賦值給this.arr
      this.arr = this.arr.slice(0, 2);
    },
    btn03() {
      // vue2 常見(jiàn)問(wèn)題:直接通過(guò)下標(biāo)修改,數(shù)據(jù)變化,但是視圖不會(huì)更新
      // this.arr[0] = "嗚嗚嗚";
      // console.log(this.arr);
      // 解決方法 $set
      // this.$set(原數(shù)組,數(shù)組下標(biāo),'修改后的值')
      this.$set(this.arr, 0, "煩躁");
    },
  },
};
# 口訣:
# 數(shù)組方法會(huì)改變?cè)瓟?shù)組,就會(huì)導(dǎo)致v-for更新,頁(yè)面更新
# 數(shù)組方法不會(huì)改變?cè)瓟?shù)組,而是返回新數(shù)組,就不會(huì)導(dǎo)致v-for更新,可采用覆蓋原數(shù)組或者this.$set()
# 
</script>

最后編輯于：2022.08.27 22:37:58

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書(shū)系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

人面猴
序言：七十年代末，一起剝皮案震驚了整個(gè)濱河市，隨后出現(xiàn)的幾起案子，更是在濱河造成了極大的恐慌，老刑警劉巖，帶你破解...
沈念sama閱讀 228,702評(píng)論 6贊 534
死咒
序言：濱河連續(xù)發(fā)生了三起死亡事件，死亡現(xiàn)場(chǎng)離奇詭異，居然都是意外死亡，警方通過(guò)查閱死者的電腦和手機(jī)，發(fā)現(xiàn)死者居然都...
沈念sama閱讀 98,615評(píng)論 3贊 419
救了他兩次的神仙讓他今天三更去死
文/潘曉璐我一進(jìn)店門(mén)，熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)，“玉大人，你說(shuō)我怎么就攤上這事。” “怎么了？”我有些...
開(kāi)封第一講書(shū)人閱讀 176,606評(píng)論 0贊 376
道士緝兇錄：失蹤的賣(mài)姜人
文/不壞的土叔我叫張陵，是天一觀的道長(zhǎng)。經(jīng)常有香客問(wèn)我，道長(zhǎng)，這世上最難降的妖魔是什么？我笑而不...
開(kāi)封第一講書(shū)人閱讀 63,044評(píng)論 1贊 314
?港島之戀（遺憾婚禮）
正文為了忘掉前任，我火速辦了婚禮，結(jié)果婚禮上，老公的妹妹穿的比我還像新娘。我一直安慰自己，他們只是感情好，可當(dāng)我...
茶點(diǎn)故事閱讀 71,826評(píng)論 6贊 410
惡毒庶女頂嫁案：這布局不是一般人想出來(lái)的
文/花漫我一把揭開(kāi)白布。她就那樣靜靜地躺著，像睡著了一般。火紅的嫁衣襯著肌膚如雪。梳的紋絲不亂的頭發(fā)上，一...
開(kāi)封第一講書(shū)人閱讀 55,227評(píng)論 1贊 324
城市分裂傳說(shuō)
那天，我揣著相機(jī)與錄音，去河邊找鬼。笑死，一個(gè)胖子當(dāng)著我的面吹牛，可吹牛的內(nèi)容都是我干的。我是一名探鬼主播，決...
沈念sama閱讀 43,307評(píng)論 3贊 442
雙鴛鴦連環(huán)套：你想象不到人心有多黑
文/蒼蘭香墨我猛地睜開(kāi)眼，長(zhǎng)吁一口氣：“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼！你這毒婦竟也來(lái)了？” 一聲冷哼從身側(cè)響起，我...
開(kāi)封第一講書(shū)人閱讀 42,447評(píng)論 0贊 289
萬(wàn)榮殺人案實(shí)錄
序言：老撾萬(wàn)榮一對(duì)情侶失蹤，失蹤者是張志新（化名）和其女友劉穎，沒(méi)想到半個(gè)月后，有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體，經(jīng)...
沈念sama閱讀 48,992評(píng)論 1贊 335
?護(hù)林員之死
正文獨(dú)居荒郊野嶺守林人離奇死亡，尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛以下內(nèi)容為張勛視角年9月15日...
茶點(diǎn)故事閱讀 40,807評(píng)論 3贊 355
?白月光啟示錄
正文我和宋清朗相戀三年，在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
茶點(diǎn)故事閱讀 43,001評(píng)論 1贊 370
活死人
序言：一個(gè)原本活蹦亂跳的男人離奇死亡，死狀恐怖，靈堂內(nèi)的尸體忽然破棺而出，到底是詐尸還是另有隱情，我是刑警寧澤，帶...
沈念sama閱讀 38,550評(píng)論 5贊 361
?日本核電站爆炸內(nèi)幕
正文年R本政府宣布，位于F島的核電站，受9級(jí)特大地震影響，放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜，卻給世界環(huán)境...
茶點(diǎn)故事閱讀 44,243評(píng)論 3贊 347
男人毒藥：我在死后第九天來(lái)索命
文/蒙蒙一、第九天我趴在偏房一處隱蔽的房頂上張望。院中可真熱鬧，春花似錦、人聲如沸。這莊子的主人今日做“春日...
開(kāi)封第一講書(shū)人閱讀 34,667評(píng)論 0贊 26
一樁弒父案，背后竟有這般陰謀
文/蒼蘭香墨我抬頭看了看天上的太陽(yáng)。三九已至，卻和暖如春，著一層夾襖步出監(jiān)牢的瞬間，已是汗流浹背。一陣腳步聲響...
開(kāi)封第一講書(shū)人閱讀 35,930評(píng)論 1贊 287
情欲美人皮
我被黑心中介騙來(lái)泰國(guó)打工，沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留，地道東北人。一個(gè)月前我還...
沈念sama閱讀 51,709評(píng)論 3贊 393
代替公主和親
正文我出身青樓，卻偏偏與公主長(zhǎng)得像，于是被迫代替她去往敵國(guó)和親。傳聞我的和親對(duì)象是個(gè)殘疾皇子，可洞房花燭夜當(dāng)晚...
茶點(diǎn)故事閱讀 47,996評(píng)論 2贊 374

三个男躁一个女,国精产品一区一手机的秘密,麦子交换系列最经典十句话,欧美国产综合欧美视频

vue指令

vue指令

v-bind

v-on

v-on事件對(duì)象

v-on修飾符

v-on按鍵修飾符

v-model

v-model修飾符

v-text/v-html

v-show/v-if

v-if 和v-else

v-for

推薦閱讀更多精彩內(nèi)容

三个男躁一个女,国精产品一区一手机的秘密,麦子交换系列最经典十句话,欧美 国产 综合 欧美 视频

vue指令

v-bind

v-on

v-on事件對(duì)象

v-on修飾符

v-on按鍵修飾符

v-model

v-model修飾符

v-text/v-html

v-show/v-if

v-if 和v-else

v-for

推薦閱讀更多精彩內(nèi)容

三个男躁一个女,国精产品一区一手机的秘密,麦子交换系列最经典十句话,欧美国产综合欧美视频