vue計算屬性中使用箭頭函式出錯

2021-09-29 16:31:43 字數 531 閱讀 2676

export default 

},computed: }}

這種情況下會報乙個這樣的錯,是我們在computed中使用了箭頭函式 

我們把箭頭函式換掉,就不會再報錯了。

首先我們來說一下computed的作用:

和普通屬性一樣是在模板中繫結計算屬性,當data中對應資料發生改變時,計算屬性值會隨之改變。

計算屬性compute是基於他們的依賴(如果是例項範疇之外的依賴,比如非響應式的notreactive是不會觸發屬性更新的)進行快取(計算屬性的結果會被快取),只有相關依賴會發生改變時才會重新求值,未改變只會返回只之前的結果,不在執行函式

此時箭頭函式的this執行發生變化(指向window),因為箭頭函式繫結了父級作用域的上下文,所以this將不會按照期望指向vue(此時vue指向window)

vue計算屬性中使用箭頭函式出錯

和普通屬性一樣在模板中使用計算屬性,當data中對應的數值發生變化時,計算屬性的值會發生相應的變化,計算屬性compute是基於他們的依賴 如果是例項範疇之外的依賴,比如非響應式的notreactive是不會觸發屬性更新的 進行儲存 計算屬性的結果會被儲存 只有相關依賴發生改變時才會重新求值,未改變...

小程式中使用箭頭函式的問題

做了乙個專案,因為只有乙個頁面,不想引入redux,同時因為所有邏輯擠在了同頁面的js下面,對於後續的除錯bug很不友好,因此想到了把js函式拆分出去.import send from utils send.js send,export default 複製 當我執行 的時候發現this為undef...

map中使用箭頭函式遇到的坑

箭頭函式提供了更簡潔和更短的語法,其中乙個可用功能是可以將函式編寫為具有隱式返回值的lambda表示式。這對於功能樣式 很方便,比如使用函式對映陣列 const numbers 1,2,3,4 numbers.map n n n 這個箭頭函式將按照預期的方式工作,它將值自身相乘並返回到包含的新陣列 ...