首页 前端知识 Uncaught (in promise) Error: Initialize failed: invalid dom.

Uncaught (in promise) Error: Initialize failed: invalid dom.

2024-09-09 00:09:49 前端知识 前端哥 352 696 我要收藏

一、问题

Uncaught (in promise) Error: Initialize failed: invalid dom.

请添加图片描述

错误代码

<script setup lang='ts'>
import { ref, onMounted } from 'vue'
import * as echarts from 'echarts';

onMounted(() => {
    drawChat()
})

const drawChat = () => {
    const mychart = ref(null)
    let myChart = echarts.init(mychart)
    let option = { }
    option && myChart.setOption(option)
}
</script>

<template>
    <div ref="mychart" class="echart"></div>
</template>

二、问题原因

获取 dom 错误,eCharts 仅支持使用原生方法获取 dom

Vueref 方法,eCharts 不支持。

三、解决办法

使用原生方法获取 dom

正确代码

<script setup lang='ts'>
import { ref, onMounted } from 'vue'
import * as echarts from 'echarts';

onMounted(() => {
    drawChat()
})

const drawChat = () => {
    let myChart = echarts.init(document.getElementById('mychart')) // 原生方法获取 dom
    let option = { }
    option && myChart.setOption(option)
}
</script>

<template>
    <div ref="mychart" class="echart"></div>
</template>

END

转载请注明出处或者链接地址:https://www.qianduange.cn//article/18003.html
标签
评论
发布的文章

JSON简介

2024-09-30 23:09:25

Node.js和npm的安装及配置

2024-09-30 23:09:02

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!