将样式绑定到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;"/>