链接:找到未知道具: onClick
链接:找到未知道具: onClick
提问于 2017-11-25 06:15:13
我用的是nextjs。当我试图添加onClick链接时，我会得到一个错误。
import React from 'react';
import PropTypes from 'prop-types';
import Link from 'next/link'
class Navbar extends React.Component {
render () {
return(
<div>
<Link href="/index" onClick={()=>console.log("sdf")}><a>Home</a></Link>
<Link href="/about"><a>About</a></Link>
</div>
)
}
}
export default Navbar;这难道不是reactjs中将onClick添加到链接中的方式吗？或者这是否与nextjs有关？
回答 2
Stack Overflow用户
回答已采纳
发布于 2018-04-11 19:47:45
是的，这是如何在React.js中添加一个处理程序来链接的方式。但是，这是来自Next.js的Next.js组件的一个问题。这个Link组件没有任何onClick支柱。它甚至用自己的实现覆盖了它的子级的onClick支柱。
所以，这也行不通：
<Link href="/index">
<a onClick={() => console.log('Does not work')}>Home</a>
</Link>简单的解决方案可以是将onClick处理程序嵌套到另一个元素中，如下所示：
<Link href="/index">
<a>
<span onClick={() => console.log('It works')}>Home</span>
</a>
</Link>或者用其他元素(例如，Link )包装span：
<span onClick={() => console.log('It also works')}>
<Link href="/index">Home</Link>
</span>关于它的一个悬而未决的问题是：https://github.com/zeit/next.js/issues/1490。
Stack Overflow用户
发布于 2017-11-25 06:26:36
尝试用onCLick替换onClick
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/47483177
复制相关文章
相似问题
腾讯云开发者
