reactjs - 如何在 JSX 中制作图像按钮？

Question

这不会显示图像，但仍可用作按钮。

<button><img src={"./img/google.png"} /></button>

我的文件夹设置是/user/img/google.png 和/user/loginGoogle.jsx ，所以我认为源代码没有问题

Answer 1

这会起作用:

<button><img src="./img/google.png" alt="my image" onClick={this.myfunction} /></button>

那么如果你定义:

  myfunction() {
        console.log("CLICKED");
  }

如果您单击图像，您将看到控制台中出现“CLICKED”。

因此，如果您将 onClick 监听器添加到图像中，它将起作用。然后，您可以将该图像包装在按钮中，甚至可以向其中添加一些 CSS 类来满足您的需求。