diff --git a/src/ECharts.ts b/src/ECharts.ts index 89c100b..6027a53 100644 --- a/src/ECharts.ts +++ b/src/ECharts.ts @@ -12,7 +12,6 @@ import { onMounted, onUnmounted, h, - mergeProps, PropType, watchEffect, Vue2 @@ -36,7 +35,7 @@ import { loadingProps } from "./composables"; import "./style.css"; -import { filterObjectValue } from "./utils"; +import { omitOn } from "./utils"; const TAG_NAME = "x-vue-echarts"; @@ -95,9 +94,7 @@ export default defineComponent({ const initOptions = toRef(props, "initOptions"); const loadingOptions = toRef(props, "loadingOptions"); - const nonEventAttrs = computed(() => - filterObjectValue(attrs, value => typeof value !== "function") - ); + const nonEventAttrs = computed(() => omitOn(attrs)); function init(option?: Option) { if (chart.value || !root.value) { @@ -244,9 +241,9 @@ export default defineComponent({ return exposed; }, render() { - return h( - TAG_NAME, - mergeProps({ class: "echarts", ref: "root" }, this.nonEventAttrs) - ); + const attrs = { ...this.nonEventAttrs }; + attrs.ref = "root"; + attrs.class = attrs.class ? ["echarts"].concat(attrs.class) : "echarts"; + return h(TAG_NAME, attrs); } }); diff --git a/src/utils.ts b/src/utils.ts index c6d1db2..15d0620 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -1,16 +1,20 @@ type Attrs = { - [key: string]: unknown; + // eslint-disable-next-line @typescript-eslint/no-explicit-any + [key: string]: any; }; -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]; +// Copied from +// https://github.com/vuejs/vue-next/blob/5a7a1b8293822219283d6e267496bec02234b0bc/packages/shared/src/index.ts#L40-L41 +const onRE = /^on[^a-z]/; +export const isOn = (key: string) => onRE.test(key); + +export function omitOn(attrs: Attrs) { + const result: Attrs = {}; + for (const key in attrs) { + if (!isOn(key)) { + result[key] = attrs[key]; } } - return target; + + return result; }