Use Web Components without native class support detection

[kingyue737]

No description provided.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
vue-echarts	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 1, 2025 9:08am

[Justineo]

I have an idea: we might be able to use this approach to support rendering components in ECharts tooltips. Previously, we didn't support this because ECharts doesn't provide a callback when a tooltip is removed from the DOM, which preventing rendered components from being disposed. It's still just a rough idea and may not be feasible, but worth exploring.

[kingyue737]

I'm not entirely sure what your approach is for implementing this feature.

What I had in mind was allowing users to pass custom components via a slot, like this:

<v-chart>
  <template #tooltip="{ params }">
    <div>
      <div>my tooltip</div>
      <MyComponent v-bind="params" />
    </div>
  </template>
</v-chart>

The slot props can then be updated using the showTip and hideTip events. These aren't listed in the "event" section of the ECharts documentation, but they are documented under "actions". I've tested that both events do exist, and we can also add type definitions for them in Vue-ECharts if needed.

[Justineo]

Hmm…I didn't realize these two events exist. Maybe they are enough for that feature.