vue 鉤子,前後端互動

2022-09-21 04:39:10 字數 1562 閱讀 7910

# 1 屬性指令

-v-bind:屬性名=屬性值

-:屬性名=屬性值

-src,href,id,name,自定義屬性

# 2 class和style屬性

-字串,陣列,物件

-class使用陣列,style使用物件(物件的key可以不加引號,如果不加引號,使用駝峰)

# 3 條件渲染

-v-if=條件

-v-else-if=條件

-v-else

-如果復合期中某乙個,顯示某個標籤

# 4 列表渲染

-v-for

-物件 item in book_list:item指的是value

value,index in book_list:value和index值和key

-陣列

-數字-字串

# v-for控制購物車商品展示

# key值的解釋:加快虛擬dom的替換

# 陣列的檢測與更新

# 資料雙向繫結 input v-model繫結

-只要input的value屬性發生變化,繫結的js變數也變化

# 事件處理

# 過濾案例:input的事件

-input:只要input發生變化,就會觸發

-change:只要value值變化,就會觸發

-blur:只要失去焦點,就會觸發

# 事件修飾符:stop(阻止事件冒泡,加在子元件上),

-self阻止事件冒泡,加在父元件上),

-prevent(阻止a標籤跳轉),

-once(只點選依次)

# 按鍵修飾符

-@keyup=函式

-只要鍵按下彈起,就會觸發

[email protected]=函式 :只要enter鍵,彈起,就會觸發

密碼:男女保密

記住密碼

足球籃球

桌球您選擇的性別:}

您選擇的愛好是:}

商品**

商品數量

選中/不選中

}}}

商品**

商品數量

選中/不選中

}}}

商品**

商品數量

選中/不選中

}}-} +

lazy:懶對應

number:只要以數字開頭,就只保留數字

trim:截掉前後的空格

}

# 8個

-created

-mounted

-updated

刪除子元件

顯示子元件

Vue 前後端互動 (Promise)

目錄非同步呼叫 promise promise 常用api 物件方法 schema host port path query fragmentschema 協議 http ftp host 網域名稱或 ip 位址 port 埠 預設為 80 path 路徑 abc lzh 虛擬 用於區分資源 que...

vue 前後端互動模式

介面呼叫方式 url位址格式 schema 協議。例如http,https,ftp等 port 埠,http預設埠80,可以省略 path 路徑,例如 abc a b c query 查詢引數,例如uname lisi age 13 fragment 錨點 雜湊hash 用於定位頁面的某個位置 a ...

Vue前後端資料互動

非同步程式設計 ajax的非同步程式設計 通過url訪問位址獲取資料,資料獲取成功後通過ajax的success屬性方法進行 但是存在乙個問題 當需要多次 時,如果有需求這幾次 的順序必須固定,那麼ajax就只能進行success的巢狀處理,但是這明顯不符合程式的健壯性和 的解耦性,所以promis...