數組作爲Vue.js組件的道具？

我有一個名爲「田」一個榮耀的輸入組件，其中我已經宣佈了一些道具，從而：數組作爲Vue.js組件的道具？

props: ['value','cols','label','group','name']

鑑於這是有效的輸入看中的包裝，還有其他不少例如，我可能也想傳入屬性，例如「佔位符」。我真的不想在道具中聲明所有這些（儘管這個列表足夠有限，當然它可以做到這一點）。我想要做的是傳遞一個數組，可能被稱爲'attrs'，它可能包含任意一組屬性。現在我知道可以做到這一點，但我的問題是，我將如何從父級創建此？我可以用類似下面的方法來做到這一點嗎（雖然顯然需要綁定）？

<field :attrs="['placeholder':'Whatever','length':42]"></field>

來源

2016-11-24 John Moore

這是一個對象不是數組，是的，它可以作爲道具傳遞對象。剛設置的值的父組件的數據對象中，即

data() { 
    return { 
    attributes: { 
     placeholder: 'Whatever', 
     length: 42, 
    }, 
    ... 
    } 
}

並結合此作爲道具：

<field :attrs="attributes"></field>

爲了澄清 - 它能夠設定對象/陣列等直接在模板，vue的模板解析器將設置相關道具上的值，即

<field :attrs="[{ name: 'foo' }, { name: 'bar' }]"></field>

然而，這不是一種最佳實踐，因爲您的模板很快就會變得混亂，並且可能會更難確定數據的設置位置。相反，建議您將此數據抽象爲組件上的param並將該param綁定到prop - 如上所述。

來源

2016-11-24 21:54:44 GuyC

是的，你是對的，在表格中顯示它是一個對象。但它可能是一組屬性對象，每個都有一個名稱和值。但問題是，是否可以在使用它的HTML中定義它，而不是從JS中定義它。在父編輯表單組件中將使用該組件的多個實例，每個實例都有其自己的一組屬性。 –

更新回答確認你可以在模板上做到這一點 - 只是不推薦 – GuyC

出於好奇，爲什麼不推薦？如果我想在表單上使用多個Field實例，我的選擇是什麼？ –

數組作爲Vue.js組件的道具？

回答

相關問題