我正在做一個Vue專案。根據eslint's 的要求，我不能用它來命名道具，camel case它會報告一個警告Attribute ':clientId' must be hyphenated. eslint vue/attribute-hyphenation需要用kekab例代替。例如，
<GranfFather :client-id="clientId" v-bind="$attrs">
<Father>
<GrandSon />
</Father>
</GrandFather>
我需要訪問<GrandSon />組件中的屬性。一般情況下，我想將屬性命名為clientId，但由于eslint公司的要求，我只能命名，client-id否則會報警告。所以，如果我想訪問這個屬性，我想出的唯一方法就是使用this.$attrs["client-id"]. 但我想知道如何通過this.$attrs.clientId或類似方法訪問此屬性？
當我this.$attrs在<GrandSon />組件中使用時，它會列印
{ client-id: "xxxxxx"}
這是否意味著我只能client-id通過this.$attrs["clientId"]？我想要的client-id只是使用this.$attrs.clientId.
uj5u.com熱心網友回復：
props和attributes是有區別的。
一個 prop 應該在 component 中指定props，它被規范化為駝峰式，并且僅由提供 prop 的組件接收。
屬性未標準化，并且可以通過用作根元素的組件。此行為由inheritAttrs組件中的屬性決定。它通常用于為根 HTML 元素提供 HTML 屬性，但也可用于為最近的接受它的嵌套組件提供一個 prop。
如果GrandSon要接收clientIdprop，則需要在props. 雖然在這種情況下它顯然可以接收一個作為 fallthrough 屬性的 prop GrandFather，但最好顯式地提供它<GrandSon :client-id="clientId">，以便它不依賴于根元素的特定層次結構。
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/429989.html
上一篇：當我從物件獲取值時，打字稿型別字串不可分配給型別keyof
下一篇：打字稿多型別映射