链接按钮onClick在React中不起作用，css将按钮更改为链接？答案

【问题标题】：Link button onClick not working in React, css to change button to a link?链接按钮onClick在React中不起作用，css将按钮更改为链接？
【发布时间】：2020-11-25 22:19:19
【问题描述】：

我在 React 中有一个按钮，单击该按钮可将页面滚动到所需位置，该按钮正在工作。

<div className={styles.classB}>
     <Button onClick={ScreenMover.MoveToElem} > Extras </Button>
</div>

但我想要没有按钮的相同 onClick 功能，比如链接，单击它时应该执行相同的操作。所以我使用了下面的链接按钮，但它没有使用 onClick，而是根据 to="" 属性转到页面顶部。

<div className={styles.classL}>
     <Link className={styles.linkButton} onClick={ScreenMover.MoveToElem} to=""> Extras </Link>
</div>

另一个想法，如果我们不能实现上面的那个，那么我们可以通过对按钮应用一些css样式来使按钮看起来像一个链接吗？我应该能够覆盖继承的按钮样式，而应该采用链接的外观。有可能吗？我们可以为它提供一个示例 css 类吗？

提前致谢。

【问题讨论】：

标签： css button hyperlink react-redux onclick

【解决方案1】：

Link 对象对您来说很重要吗？

如果没有，您可以使用简单的<p> 标签，onClick 事件将完美运行。

<p className={styles.linkButton} onClick={ScreenMover.MoveToElem}> Extras </p>

【讨论】：

感谢您的快速回复。 Link 对象对我来说并不重要。 onClick 与
完美搭配。但是当鼠标只悬停在这个元素上时，我们如何为链接提供下划线和鼠标悬停等功能呢？
您可以使用 CSS 达到此结果。将此 css 类添加到对象中。 .plink { cursor: pointer; text-decoration: underline; }