將樣式綁定到vue中的子組件

Question

我有一個子組件。 我想將內聯樣式綁定到該組件中。 我想傳遞這些樣式屬性（高度：200px；溢出-y：滾動）。

我試過這樣傳遞：

<Childcomponent style="height: 200px; overflow-y: scroll;" /> <Childcomponent style="height: 200px; overflow-y: scroll;" />但不工作。

然后我試過這樣：

<Childcomponent:style="{'height': '200px'; 'overflow-y': 'scroll'}" />它也不起作用。

如何將內聯樣式綁定到這個子組件？

Answer 1

喲可以做到以下幾點：

<div style="height: 200px; overflow-y: scroll;">
   <Childcomponent />
</div>

如果你希望它以你的方式完成，你必須在你的組件中創建prop ，將 styles 傳遞給它，然后將它們應用到組件內部的標簽上。

像那樣：

在Childcomponent文件中添加

prop {
   myStyles: String;
   ...
}

那些 styles 您將在您想要的標簽中使用（我相信，在根目錄中）。 然后您可以通過這種方式從父級傳遞 styles ：

<Childcomponent my-styles="height: 200px; overflow-y: scroll;"/>