眾所周知,vue是單向資料流,一般我們也不會在子元件裡面修改父元件傳進來的值,但總有需要修改的時候。
前段時間乙個專案中有遇到上述情況,假設我直接傳進來乙個list, 當時我直接在裡面改了list,但是卻驚訝的發現沒有報錯,以前好像有遇到直接修改丟擲錯誤的,但這次卻沒有,當時也沒有多想,最近空閒下來又想了下,發現自己確實**了(此處省略兩字_)。原因如下:
因為我傳進來的list是個陣列,屬於引用型別,修改子元件相當於把父元件也同時修改了,所以沒有報錯,如果是個基本型別的資料直接修改那麼vue會報錯。
在子元件修改props的方法:
1. 子元件data中拷貝乙份,注意引用型別需要深拷貝,根據需求可以watch監聽
data()
},watch:
}
2. 通過計算屬性修改computed:)}
}
3. 通過研究大佬們的寫法又發現了一種修改方式: sync修飾符
父元件 傳進去的時候加上 .sync
子元件 通過this.$emit(『update:***』, params)
// 父元件
"list"
/>
// 子元件
methodname
(index)
vue中修改props傳進來的值
總所周知,vue是單向資料流,一般我們也不會在子元件裡面修改父元件傳進來的值,但總有需要修改的時候。前段時間乙個專案中有遇到上述情況,假設我直接傳進來乙個list,當時我直接在裡面改了list,但是卻驚訝的發現沒有報錯,以前好像有遇到直接修改丟擲錯誤的,但這次卻沒有,當時也沒有多想,最近空閒下來又想...
props寫法 Vue中props的用法知識點
vue中props的詳解 看一下官方文件 元件例項的作用域是孤立的。這意味著不能 也不應該 在子元件的模板內直接引用父元件的資料。父元件的資料需要通過 prop 才能下發到子元件中。也就是props是子元件訪問父元件資料的唯一介面。詳細一點解釋就是 乙個元件可以直接在模板裡面渲染data裡面的資料 ...
vue中的props物件
1.props物件的定義 props其實是properties的縮寫,props物件是用來定義屬性的。props物件可以接受陣列形式的引數又或者是物件形式的引數。陣列形式 props title likes ispublished commentids author 物件形式 在物件形式中,可以指定...