Question

谢谢您的时间。我在使此链接正常工作时遇到麻烦。我使用过BrowserRouter并向路由器传递了路径和组件。但是，我仍然收到跨源错误，并且帮助会很棒。这是代码

    class Products extends React.Component {
  render() {
    return (
      <div className="container">
        <div className="row">
          <div className="col-4">
            <div className="card">
              <img
                className="card-img-top"
                src="/images/pathToYourImage.png"
                alt="Card cap"
              />
              <div className="card-body">
                <h4 className="card-title">Card title</h4>
                <p className="card-text">
                  Some quick example text to build on the card title and make up
                  the bulk of the card's content.
                </p>
                <Link to="/">
                <div className="btn btn-primary">
                  Go somewhere
                </div>
                </Link>
              </div>
            </div>
          </div>
          <div className="col-4">Product Two</div>
          <div className="col-4">Product Three</div>
        </div>
      </div>
    );
  }
}
export default Products;

Answer 1

没有理由包括Route或BrowserRouter <Link to="/"><div className="btn btn-outline-primary">Go Somewhere</div></Link> 检查缩进后

Answer 2

出于安全原因，跨源资源共享（cors）已禁用，您将需要手动启用它。我将一个名为 cors 的软件包用于基于Express的后端。

第1步

npm install cors

第2步

const cors = require('cors')

最后一步

app.use(cors())

这将为所有路由启用CORS。您还可以启用单个路由。检查github

上的文档

为什么在React中声明链接时会出现跨源错误

2 个答案: