vue3 小知識點

2021-10-21 20:46:40 字數 1242 閱讀 5268

1.reactive

reactive 用於為物件新增響應式狀態。接收乙個js物件作為引數,返回乙個具有響應式狀態的副本。

import  from 'vue'

// 響應式狀態

const state = reactive()

// 列印count的值

console.log(state.count)

// 頁面顯示}​

//直接匯出state

return

2.ref

ref 用於為資料新增響應式狀態。由於reactive只能傳入物件型別的引數,而對於基本資料型別要新增響應式狀態就只能用ref了,同樣返回乙個具有響應式狀態的副本。

3.torefs

torefs()函式可以將reactive()建立出來的響應式物件,轉換為普通物件,只不過這個物件上的每個屬性節點,都是ref()型別的響應式資料

// 響應式狀態

const state = reactive()

const msg =  reactive()

// 返回值

return torefs(state)

// 基本約等於

return ,

num:

}// 模板內顯示count,自動新增.value

}

return 

// 基本約等於

return ,

num:

}// 模板內顯示count ,自動新增.value

}// 模板內顯示msg的title

}

4.es6之擴充套件運算子 三個點(...)

物件中的擴充套件運算子(...)用於取出引數物件中的所有可遍歷屬性,拷貝到當前物件之中

let bar = ;

let baz = ; //

// 等價於

let baz = object.assign({}, bar); //

object.assign方法的第乙個引數是目標物件,後面的引數都是源物件。(如果目標物件與源物件有同名屬性,或多個源物件有同名屬性,則後面的屬性會覆蓋前面的屬性)。

Vue小知識點

動態路由 巢狀路由 routes 程式設計式導航 字串 router.push home 物件 router.push 命名的路由 router.push 帶查詢引數,變成 register?plan private router.push const userid 123 router.push ...

vue小知識點

小知識點 this.forceupdate 強制渲染 如果element table 中間某行出現貫穿線可以為其新增樣式 el table before 嵌入子元件常用方法 父元件可以通過this.refs.tree.changecon 11111 執行子元件方法並穿參 this.children ...

VUE小知識點

1 通過data中的list迴圈img 在data中需要新增 require 如 2 獲取元素的data屬性 前台 js jump e 3 js裡進行跳轉 html 點我到第二個頁面js methods 4 向data中賦值 let that this that.center 0 center為da...