diff --git a/src/ECharts.ts b/src/ECharts.ts index 05d2d54..89c100b 100644 --- a/src/ECharts.ts +++ b/src/ECharts.ts @@ -12,6 +12,7 @@ import { onMounted, onUnmounted, h, + mergeProps, PropType, watchEffect, Vue2 @@ -35,6 +36,7 @@ import { loadingProps } from "./composables"; import "./style.css"; +import { filterObjectValue } from "./utils"; const TAG_NAME = "x-vue-echarts"; @@ -61,6 +63,7 @@ export default defineComponent({ ...autoresizeProps, ...loadingProps }, + inheritAttrs: false, // eslint-disable-next-line @typescript-eslint/no-unused-vars // @ts-expect-error setup(props, { attrs, listeners }) { @@ -92,6 +95,10 @@ export default defineComponent({ const initOptions = toRef(props, "initOptions"); const loadingOptions = toRef(props, "loadingOptions"); + const nonEventAttrs = computed(() => + filterObjectValue(attrs, value => typeof value !== "function") + ); + function init(option?: Option) { if (chart.value || !root.value) { return; @@ -225,6 +232,7 @@ export default defineComponent({ const exposed = { root, setOption, + nonEventAttrs, ...publicApi }; Object.defineProperty(exposed, "chart", { @@ -236,6 +244,9 @@ export default defineComponent({ return exposed; }, render() { - return h(TAG_NAME, { class: "echarts", ref: "root" }); + return h( + TAG_NAME, + mergeProps({ class: "echarts", ref: "root" }, this.nonEventAttrs) + ); } }); diff --git a/src/utils.ts b/src/utils.ts new file mode 100644 index 0000000..c6d1db2 --- /dev/null +++ b/src/utils.ts @@ -0,0 +1,16 @@ +type Attrs = { + [key: string]: unknown; +}; + +export function filterObjectValue( + source: Attrs, + predicate: (key: unknown) => boolean +) { + const target: Attrs = {}; + for (const key in source) { + if (predicate(source[key])) { + target[key] = source[key]; + } + } + return target; +}