React - 使用按钮进行重定向 link

Question

我是 React 的新手，很抱歉，如果这太基础了。

我正在尝试在我的应用程序中添加一个按钮以将其重定向到 Spotify。

到目前为止，我就是这样做的。

class Spotify extends Component {
  constructor () {
    super()
    this.handleClick = this.handleClick.bind(this)
  }

  handleClick () {
    console.log('Success!')
  }

  render () {
    return (
      <div className='button__container'>
        <button className='button' onClick={this.handleClick}>
          Link your Spotify account
        </button>
      </div>
    )
  }
}

export default Spotify;

现在，将上述按钮链接到的最佳方式是什么：

 <a href="http://localhost:8888"></a>

Answer 1

我想你正在寻找这样的东西：

class Spotify extends Component {    
  render () {
    return (
      <div className='button__container'>
        <a className='button' role="button" href="http://someurl.com">
          Link your Spotify account
        </a>
      </div>
    )
  }
}

export default Spotify;

如果您的组件不需要状态，请考虑将上述代码重构为无状态组件，如下所示：

export const Spotify = () => (
      <div className='button__container'>
        <a className='button' role="button" href="http://someurl.com">
          Link your Spotify account
        </a>
      </div>
);

如果您只是想显示一个 link，锚标记就可以了。您可以将 target="_blank" 添加到您的锚标记以使其在新标签页中打开。

React - 使用按钮进行重定向 link

React - use button for redirect link

redirect

href

reactjs