我是否需要顯式聲明所有組件屬性（vue.js）？

我正在處理一種組件，這是一種美化的輸入控件，它將使用Bootstrap網格節省大量表單的重複HTML（必須在每個網格旁放置一個標籤，將'for'屬性分配給它爲輸入分配一個「表格控制」類，等等）。這個想法是，該組件包含一個輸入控件，其中已經設置了默認值（例如'表格控件'類），標籤已預先設置等。我是否需要顯式聲明所有組件屬性（vue.js）？

HTML'輸入'控件作爲一整組可選屬性，其中一些我可能希望在某些時候使用 - 只讀，禁用，佔位符等。如果我可以使用它們中的一個或多個，我實際上是否必須在組件的屬性中預先聲明所有這些？如果這是真的，這有點麻煩而且很麻煩。如果所有未明確聲明的屬性都在組件的作用域中簡單提供，那將很方便。

這是我想象的，一個常見的足夠的要求，也許有另一種方式做到這一點？

來源

2016-12-09 John Moore

我想，如果你有一個名爲'inputAttrs'的prop'有不同ent屬性和值，你可以執行''。 –

你不需要聲明所有這些，你可以使用v-bind來綁定可選屬性的對象。所以，在你的父母，你可以這樣做：

<custom-input :optional-attrs="{placeholder: 'Type something!'}"></custom-input>

然後在你的組件簡單地將其添加爲道具：

props: { 
    optionalAttrs: {} 
}

而在你的組件在你的輸入使用v-bind：

<input type="text" class="form-control" v-bind="optionalAttrs">

這裏的JSFiddle：https://jsfiddle.net/rww551og/

來源

2016-12-09 12:53:34

我剛開始探索這種方法，所以很高興看到它是可行的。謝謝！ –

你必須聲明所有可以使用的道具，但是你必須在需要的道具上添加REQUIRE：TRUE。就這樣。

來源

2016-12-09 11:38:53

好吧，所以我說得對，因爲做我想做的事很麻煩。 HTML輸入標籤有超過30種可能的屬性。不得不在我的組件屬性中聲明所有這些都會讓設計變得糟糕，即使它實際上並不需要很長時間。 –

我是否需要顯式聲明所有組件屬性（vue.js）？

回答

相關問題