淺談Vue初學(xué)之props的駝峰命名
在vue的中文官網(wǎng)有這樣的說明：HTML 中的特性名是大小寫不敏感的，所以瀏覽器會(huì)把所有大寫字符解釋為小寫字符。這意味著當(dāng)你使用 DOM 中的模板時(shí)，camelCase (駝峰命名法) 的 prop 名需要使用其等價(jià)的 kebab-case (短橫線分隔命名) 命名。
重申一次，如果你使用字符串模板，那么這個(gè)限制就不存在了。
以以下代碼為例：
1、當(dāng)組件中template及props等使用駝峰式命名，在html中對(duì)應(yīng)的改成短橫線命名方式。
2、當(dāng)組件中template及props等使用字符串模板，在html中改成對(duì)應(yīng)的小寫。
源碼說明：
在Vue的源碼中創(chuàng)建Vue組件的時(shí)候createComponent()，解析組件的相關(guān)屬性
// extract props var propsData = extractPropsFromVNodeData(data, Ctor, tag);
而，在extractPropsFromVNodeData()中，Vue通過調(diào)用內(nèi)部方法hyphenate，把駝峰形式的屬性轉(zhuǎn)換為橫斷線形式。
除此之外，Vue在initProps()，validateProp()時(shí)，都將駝峰形式的屬性轉(zhuǎn)換為橫斷線形式。
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了vue3雙向綁定實(shí)現(xiàn)原理解讀,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-10-10
vue2從數(shù)據(jù)變化到視圖變化發(fā)布訂閱模式詳解
這篇文章主要為大家介紹了vue2從數(shù)據(jù)變化到視圖變化發(fā)布訂閱模式詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-09-09
vue3中的watch和watchEffect實(shí)例詳解
watch和watchEffect都是監(jiān)聽器,但在寫法和使用上有所區(qū)別,下面這篇文章主要給大家介紹了關(guān)于vue3中watch和watchEffect的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-05-05
vue-electron項(xiàng)目創(chuàng)建記錄及問題小結(jié)解決方案
這篇文章主要介紹了vue-electron項(xiàng)目創(chuàng)建記錄及注意事項(xiàng),本文給大家分享了運(yùn)行項(xiàng)目報(bào)錯(cuò)的問題小結(jié)及多種解決方案,需要的朋友可以參考下2024-03-03
這篇文章主要介紹了vue 優(yōu)化CDN加速的方法示例，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-09-09
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)div拖拽互換位置的方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-12-12
下面小編就為大家分享一篇vue2.0模擬錨點(diǎn)的實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-03-03
vue DatePicker日期選擇器時(shí)差8小時(shí)問題
這篇文章主要介紹了vue DatePicker日期選擇器時(shí)差8小時(shí)問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-05-05
Vue報(bào)錯(cuò)ERR_OSSL_EVP_UNSUPPORTED解決方法
Vue項(xiàng)目啟動(dòng)時(shí)報(bào)錯(cuò)ERR_OSSL_EVP_UNSUPPORTED,本文主要介紹了Vue報(bào)錯(cuò)ERR_OSSL_EVP_UNSUPPORTED解決方法,具有一定的參考價(jià)值,感興趣的可以了解一下2024-08-08
這篇文章主要介紹了如何手寫簡(jiǎn)易的 Vue Router，幫助大家更好的理解和使用vue，感興趣的朋友可以了解下2020-10-10