• <pre id="y08ey"><del id="y08ey"><xmp id="y08ey"></xmp></del></pre>
    1. <pre id="y08ey"></pre>
      
      <p id="y08ey"><strong id="y08ey"><small id="y08ey"></small></strong></p>
      <td id="y08ey"><ruby id="y08ey"></ruby></td>
      <p id="y08ey"><strong id="y08ey"><xmp id="y08ey"></xmp></strong></p>
      <pre id="y08ey"></pre>

      <table id="y08ey"></table>
        <track id="y08ey"></track>
      1. 手機: 18919834768
        電話熱線: 0931-7603702
        網站知識
        當前位置: 主頁 > 網站知識

        vue3值綁定和修飾符

        發布時間:2023-02-20 21:42:40???來自:未知???編輯:蘭州啟點網絡 www.syzhibo.net

        學習要點:
        1.值綁定
        2.修飾符
        本節課我們來開始學習 Vue3.x 的表單中 value 值的綁定和修飾符功能。
        一.值綁定
        1. 使用 v-model 操作 input 等,是直接操作和綁定 value 值的;
        2. 但是對于 checkbox 等表單,是操作它的 checked 等首選項的;
        3. 所以,此時我們需要對這些表單元素的 value 值進行綁定操作;
        <input type="checkbox" id="checkbox" v-model="checked">
        <div>{{checked}}div>
        return {
        checked : true
        }
        PS:雖然可以進行雙向綁定切換,但本質上這個 checkbox 并沒有 value 值;
        PS:我們可以通過控制臺查看器觀察,此時我們還需要進行值綁定操作;
        <input type="checkbox" id="checkbox" v-model="checked"
        v-bind:value="checked">
        PS:單選框,下拉框均可以使用這種方法給 value 賦值;
        二.修飾符
        1. 有時我們不需要數據綁定的時候逐個觸發,可以使用.lazy 修飾符;
        <input type="text" v-model.lazy="message">
        {{message}}
        2. 使用.number 修飾符將輸入的內容轉換為 number 數值類型;
        <input type="text" v-model.number="number" type="number">
        {{typeof number}}
        3. 使用.trim 清理掉內容左右的空格;
        <input type="text" v-model.trim="message">
        本文由:蘭州啟點網絡(www.syzhibo.net)整理發布!

        ? QQ咨詢

        建站咨詢 售前咨詢 私人訂制 售后技術

        ? 電話咨詢

        0931-7603702
        (早9:00-晚10:00)

        ? 微信咨詢

        掃碼關注
        點點租

        ? 返回頂部
        午夜无码区在线观看_久久精品国产亚洲一区二区_久久综合日本久久综合88_在线观看国产一区