所以我有一个DIV元素,当按下时,我想在另一个窗口中打开一个新选项卡。唯一的问题是,每当刷新页面或按下任何其他div元素时,也会启动该功能并在另一个窗口中打开一个页面。我将在下面包含我的代码,但我不知道为什么会发生这种情况,因为我正在使用onClick={window.open("https://www.thechinesewriter.com")
就像我说的那样,我只想在按下div时打开一个新选项卡,而不是在任何其他项目时单击页面或甚至刷新页面本身。
import React from "react";
import "./Column1.css";
class Column1 extends React.Component {
render() {
return(
<React.Fragment>
<div className="rectImage">
<img className="imagePost" src={this.props.image} />
</div>
<div onClick={window.open("https://www.thechinesewriter.com")} className="downloadBut1">
<h2>
Source
</h2>
</div>
<div className="downloadBut2">
<h2>
Repository
</h2>
</div>
</React.Fragment>
)
}
}
export default Column1;
你需要将这个函数称为回调函数。
<div onClick={() => window.open("https://www.thechinesewriter.com")} className="downloadBut1">
否则,每次渲染组件时都会调用它。
您使用表达式,该表达式将在每次呈现组件时执行。
<div onClick={window.open("https://www.thechinesewriter.com")} className="downloadBut1">
你可能想要使用一个函数
<div onClick={() => window.open("https://www.thechinesewriter.com")} className="downloadBut1">