Salesforce 通过Lightning Web组件中的插槽呈现图表JS

我试图通过一个槽渲染一个图表JS画布

chartWrapper.html

chartWrapperContainer.html

图表不呈现，呈现标记中的画布显示0宽度和高度。无槽渲染效果良好；由于结构原因，我需要把它包进一个槽里

---

这有什么问题？

这是通过将画布包装在

div

中解决的；对我来说，不把一张普通的“照片”塞进一个它不知道其内部的插槽是合乎逻辑的

---

或者，您可以通过：host伪类设置CSS属性，将自定义元素定义为

块

，或

内联块

。（默认情况下，自定义元素的

显示

值设置为

内联

）

然后您可以设置其

高度

和

宽度

，或者让默认值：

<!-- chartWrapper.html -->
<template>
   <style>
      :host {
          display: inline-block ;
          width: 50% ;
          height: 200px ;
      }
   </style>  
   <slot></slot>
</template>

：主持人{
显示：内联块；
宽度：50%；
高度：200px；
}