如何在 react-vis 中从 onValueMouseOver 获取事件?
How do I get the event from onValueMouseOver in react-vis?
根据 react-vis doc,onValueMouseOver
应该 return event
和 datapoint
。但是,该事件似乎没有通过。我做错了什么吗?
const Charts = () => {
const data = [
{ x: 1, y: 1 },
{ x: 2, y: 1 },
{ x: 3, y: 5 },
{ x: 4, y: 5 },
{ x: 5, y: 1 },
];
return (
<XYPlot height={400} width={400}>
<VerticalBarSeries
data={data}
onValueMouseOver={(datapoint, event) => {
console.log(event.target); // undefined
}}
/>
</XYPlot>
);
};
实际上 event
参数有一个 event
属性,您可以使用它并访问实际事件。
你要么这样做:
<VerticalBarSeries
data={data}
onValueMouseOver={(datapoint, event) => {
console.log(event.event.target); // Some SVG element
}}
/>
或使用解构:
<VerticalBarSeries
data={data}
onValueMouseOver={(datapoint, { event }) => {
console.log(event.target); // Some SVG element
}}
/>
根据 react-vis doc,onValueMouseOver
应该 return event
和 datapoint
。但是,该事件似乎没有通过。我做错了什么吗?
const Charts = () => {
const data = [
{ x: 1, y: 1 },
{ x: 2, y: 1 },
{ x: 3, y: 5 },
{ x: 4, y: 5 },
{ x: 5, y: 1 },
];
return (
<XYPlot height={400} width={400}>
<VerticalBarSeries
data={data}
onValueMouseOver={(datapoint, event) => {
console.log(event.target); // undefined
}}
/>
</XYPlot>
);
};
实际上 event
参数有一个 event
属性,您可以使用它并访问实际事件。
你要么这样做:
<VerticalBarSeries
data={data}
onValueMouseOver={(datapoint, event) => {
console.log(event.event.target); // Some SVG element
}}
/>
或使用解构:
<VerticalBarSeries
data={data}
onValueMouseOver={(datapoint, { event }) => {
console.log(event.target); // Some SVG element
}}
/>