Question

我是新来的反应者，在我的应用程序中，除了我单击应用程序中的链接以转到另一页的页面时，我得到空白页而是在重新加载/刷新后显示页面内容，因此工作正常。我在我的react应用程序中使用了CDN文件这里可能是什么问题？

这就是我如何加载看起来像这样的

http://127.0.0.1/my-app/?page=history

链接看起来像这样

<a href="?page=home" className="menu-item-active"><i className="fa fa-home"></i>Home</a>

我在index.html文件中呈现URL的代码如下

var urlParams = new URLSearchParams(window.location.search);
  var page=(urlParams.get('page'));
  if(page=="home")
  {
    ReactDOM.render(<App content={<HomePage/>}/>,document.getElementById('root'));
  }
  else if(page=="history")
  {
    ReactDOM.render(<App content={<HistoryPage/>}/>,document.getElementById('root'));
  }
  else
  {
    ReactDOM.render(<App content={<Login/>}/>,document.getElementById('root'));
  }

Answer 1

根据文档，这不是正确的路由选择方式。使用CDN时，一个简单的解决方案是包含<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table><tr><td valign="top"> <input type="text" class="show-name" id="in1" name="[content][0][name]" value="[content][0][name]"><br> <input type="text" class="show-name" id="in2" name="[content][1][name]" value="[content][1][name]"><br> <input type="text" class="show-name" id="in3" name="[content][1][nickname]" value="[content][0][nickname]"><br> <input type="text" class="show-name" id="in4" name="[content][0][extra]" value="[content][0][extra]"><br> <input type="text" class="show-name" id="in3" name="[content][0]" value="[content][0]"><br> </td> <td> <input type="text" id="check" value="[content][*][name]" oninput="checkPattern(this.value)" /> <br> <button onclick="buttonClick(this);">[content][*][*]</button><br> <button onclick="buttonClick(this);">[content][1][*]</button><br> <button onclick="buttonClick(this);">[content][*][*x*]</button><br> <button onclick="buttonClick(this);">[content][*][name]</button><br> <button onclick="buttonClick(this);">[content][*][*name]</button><br> <button onclick="buttonClick(this);">[*][*][*]</button><br> <button onclick="buttonClick(this);">[*][*]</button><br> </td> </tr> </table>中的react-router-dom 然后输入下面的代码代替您当前正在做的事情：

https://unpkg.com/react-router-dom/umd/react-router-dom.min.js

您也可以在this link

中查看文档。

当我单击链接时，ReactJs空白页，但是刷新后，页面内容显示出来

1 个答案: