在高图集mouseOver上响应mouseOver抛出错误
在高图集mouseOver上响应mouseOver抛出错误
提问于 2021-09-16 16:20:57
我有一个高图表的反应类型记录应用程序。我想要更新一个“价格”标签(除了高原车)，根据我得到的数据，当一个用户正在悬停他们的鼠标在图表的一部分。
mouseOver回调运行良好，我可以成功地将我想要的数据记录到控制台。但是，当我试图使用useState钩子来更新setPrice的价格状态时，我会从高级图表中得到一个错误。如果我将setPrice行注释掉，则没有错误。有什么想法吗？
Uncaught TypeError: Cannot read properties of null (reading 'yAxis')
at highstock.src.js:24009
at Array.forEach (<anonymous>)
at c.getAnchor (highstock.src.js:23992)
at c.refresh (highstock.src.js:24517)
at c.runPointActions (highstock.src.js:27941)
at c.onContainerMouseMove (highstock.src.js:27502)下面是我如何实现它的一些伪代码：
const [price, setPrice] = useState<number>(0)
options = {
...
plotOptions: {
series: {
point: {
events: {
mouseOver: function(e:any) {
price = // logic to fetch price based on mouse position
console.log(price)
setPrice(price)
}
}
}
}
}
}和html (样式-组件)
<Price>{ price }</Price>回答 2
Stack Overflow用户
回答已采纳
发布于 2021-09-16 17:21:33
数据可能无法立即获得，这就是它返回空数据的原因。但是，您可以像这样使用setTimeout延迟异步设置数据。
const [price, setPrice] = useState<number>(0)
options = {
...
plotOptions: {
series: {
point: {
events: {
mouseOver: function(e:any) {
price = // logic to fetch price based on mouse position
console.log(price)
setTimeout(() => { // This is where the delay comes in
setPrice(price)
}, 0)
}
}
}
}
}
}Stack Overflow用户
发布于 2021-09-16 17:09:04
我的预感是有一段时间延迟才能把数据拿回给你。尝试异步/等待，然后根据这些结果设置状态。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/69211937
复制相关文章
相似问题
腾讯云开发者
