VUE3中Echarts 出现tooltip.trigger=‘axis‘,提示框不显示问题

问题:

VUE3中Echarts tooltip.trigger=‘axis‘不展示提示框;tooltip.trigger=‘item‘时出现提示框。

请检查以下几点:

  1. 确保 tooltip 组件没有被禁用(即设置为 show: false),show属性可不设置,默认为true

  2. 确保 trigger 属性正确设置为 'axis'

  3. 确保你的图表实例化没有问题,并且已经正确加载了配置。

如果以上都是正确的,但仍然不显示提示框,

解决方案:(最终极)

不要将 echarts 实例包装成响应式对象,也就是避免使用 ref 和 reactive。可以用 shallowRef 或者普通变量

import { ref, reactive, watch, onMounted, markRaw } from 'vue';

const chartId= document.getElementById(this.id);
this.echart = markRaw(echarts.init(chartId));
this.echart.setOption({ ... })

markRaw: 将一个对象标记为不可被转为代理。返回该对象本身。

toRaw:根据一个 Vue 创建的代理返回其原始对象。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/759279.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

取证工作:怎样解锁 LUKS2 加密磁盘?

对于 LUKS2 密码进行恢复,Elcomsoft Distributed Password Recovery (简称 EDPR) 软件可以构建高性能集群,以更快地破解密码。EDPR 软件提供零开销的可扩展性,并支持 GPU 加速,以加快恢复速度。EDPR 可帮助…

下属无执行力,领导无能为力?用好这3大法则,打造一流行动力

下属无执行力,领导无能为力?用好这3大法则,打造一流行动力 第一个:漏斗法则 在沟通这个领域,有一个漏斗法则,意思就是指:如果你脑袋里面想表达的是100%,那你说出口的会只有80%&…

开发板以电脑为跳板连接互联网

标题 开发板以电脑为跳板连接互联网网络共享方式桥接方式 开发板以电脑为跳板连接互联网 分享下用网线直连电脑的开发板如何以电脑为跳板连接互联网的两个方法。 网络共享方式桥接方式 补充下,我的电脑连接的是无线网络,开发板和电脑是用网线进行连接的…

AI奏响未来乐章:音乐界的革命性变革

AI在创造还是毁掉音乐 引言 随着科技的飞速发展,人工智能(AI)正在逐渐渗透到我们生活的每一个角落,音乐领域也不例外。AI技术的引入,不仅为音乐创作、教育、体验带来了革命性的变革,更为整个音乐产业注入了…

昇思25天学习打卡营第7天|模型训练

模型训练 模型训练一般分为四个步骤: 构建数据集。定义神经网络模型。定义超参、损失函数及优化器。输入数据集进行训练与评估。 前面几天依次学习了前面几个步骤的操作,今天继续学习模型训练。 数据集和神经网络模型这个前面已经有详细的介绍。准确…

生成式AI如何赋能教育?商汤发布《2024生成式AI赋能教育未来》白皮书

生成式AI正在各个行业中展现出巨大的应用前景。在关系国计民生的教育行业,生成式AI能够催生哪些创新模式? 6月28日,商汤科技受邀参加2024中国AIGC应用与发展峰会,并在会上发布《2024生成式AI赋能教育未来》白皮书,提出…

Qt:5.QWidget属性介绍(isEnabled和geometry)

目录 一、 QWidget属性的介绍: 二、Enabled属性: 2.1Enabled属性的介绍: 2.2获取控件当前可用状态的api——isEnabled(): 2.3设置控件当前的可用状态的api—— setEnabled() : 2.4 实例:通过一个按钮&…

【人工智能学习之图像操作(六)】

【人工智能学习之图像操作(六)】 Hough变换直线检测圆检测 图像分割 Hough变换 在图像处理中,霍夫变换用来检测任意能够用数学公式表达的形状,即使这个形状被破坏或者有点扭曲 直线检测 import cv2 import numpy as np image …

Python 基础:用 json 模块存储和读取数据

目录 一、用 json 存储数据二、用 json 读取数据 遇到看不明白的地方,欢迎在评论中留言呐,一起讨论,一起进步! 本文参考:《Python编程:从入门到实践(第2版)》 用户关闭程序时&#…

Redux实现Token持久化

业务背景: Token数据具有一定的时效时间,通常在几个小时,有效时间内无需重新获取,而基于Redux的存储方式又是基于内存的,刷新就会丢失,为了保持持久化,我们需要单独做处理 解决方案: 使用redu…

HTML图片链接缓存问题解决

关于解决HTML使用图片链接出现的缓存问题处理 1、项目上明明替换了图片却没发现更新,得去浏览器设置清除浏览器缓存或者其它一些操作才能解决,这也太麻烦了!加载过一次不会再加载第二次,其实这时候就存在浏览器图片缓存情况&…

1-5题查询 - 高频 SQL 50 题基础版

目录 1. 相关知识点2. 例题2.1.可回收且低脂的产品2.2.寻找用户推荐人2.3.大的国家2.4. 文章浏览 I2.5. 无效的推文 1. 相关知识点 sql判断,不包含null,判断不出来distinct是通过查询的结果来去除重复记录ASC升序计算字符长度 CHAR_LENGTH() 或 LENGTH(…

cpu,缓存,辅存,主存之间的关系及特点

关系图 示意图: ------------------- | CPU | | ------------- | | | 寄存器 | | | ------------- | | | L1缓存 | | | ------------- | | | L2缓存 | | | ------------- | | | L3缓存 | | | ------------- | ----…

2095.删除链表的中间节点

给你一个链表的头节点 head 。删除链表的中间节点 ,并返回修改后的链表的头节点 head。 长度为 n 链表的中间节点是从头数起第 ⌊n / 2⌋ 个节点(下标从 0 开始),其中 ⌊x⌋ 表示小于或等于 x 的最大整数。 对于 n 1、2、3、4 和…

深入理解 Spring MVC:原理与架构解析

文章目录 前言一、MVC二、Spring MVC三、Spring MVC 工作流程四、小结推荐阅读 前言 Spring MVC 是一种基于 Java 的 Web 应用开发框架,它通过模型-视图-控制器(Model-View-Controller, MVC)的设计模式来组织和管理 Web 应用程序。本文将深入…

树莓派3B读写EEPROM芯片AT24C256

AT24C256是一个Atmel公司的EEPROM存储芯片,容量是256K个bit(也就是32K字节),I2C接口,而树莓派正好有I2C接口,如下图蓝框中的4个IO口, 把AT24C256和这4个口接在一起,这样硬件就准备好…

Nginx的11个执行阶段

Nginx的11个执行阶段

ARCGIS添加在线地图

地图服务地址:http://map.geoq.cn/ArcGIS/rest/services 具体方法: 结果展示:

Spring底层原理之bean的加载方式八 BeanDefinitionRegistryPostProcessor注解

BeanDefinitionRegistryPostProcessor注解 这种方式和第七种比较像 要实现两个方法 第一个方法是实现工厂 第二个方法叫后处理bean注册 package com.bigdata1421.bean;import org.springframework.beans.BeansException; import org.springframework.beans.factory.config.…

轻量级仿 SpringBoot 程序

但凡 Java 程序,想必就是 Spring 程序;但凡 Spring 程序,想必就是 SpringBoot 程序——且慢,当今尚有不是 SpringBoot 即 SpringMVC 的程序不?有——老旧的遗留系统不就是嘛~——不,其实只要稍加“调教”&a…