【React】react.js <a>自动执行绑定的onClick事件 如何解决

• Z时代
• 2024-01-10
• 分类：技术分享

我在antdUI组件库中的Table组件 使用render方法添加自定义组件

{
title:" 二维码",
dataIndex:"erweima",
key:'erweima',
render:(text)=>{
return(
<a href="#" onClick={this.onLoadQR(text)}><Icon type="qrcode" />下载</a>
)
}
},

监听函数：

onLoadQR =(text,e) =>{
console.log("111");
console.log(text);
}

然后在浏览器查看。组件渲染时自动触发onLoadQR函数（未有任何点击）

请教大家，这个是什么原因呢

回答

<a href="#" onClick={this.onLoadQR.bind(this, text)}><Icon type="qrcode" />下载</a>

你的写法是直接就执行onLoadQR方法了

<a href="#" onClick={()=>this.onLoadQR(text)}><Icon type="qrcode" />下载</a>

更友好的写法

以上是 【React】react.js <a>自动执行绑定的onClick事件 如何解决 的全部内容， 来源链接： utcz.com/a/76784.html