Reactjs 使用请求查询参数，响应路由器

我对链接参数有问题：

我想要这样的东西， 现在我已经做了所有的事情，并制作了一个html选择标记 当你选择任何一个城市时，你都会找到你想要的

但当您刷新页面时，您将丢失所选内容 然后你必须重新选择城市，因为 该链接看起来仍然像：

…com/list

，尽管我有 已在我的呼叫链接中声明请求查询（使用axios） 在我的组件中

所以我的问题是，如何在我的交换路由中声明它！？

---

我的演示如下：

查询参数可能有点棘手，但您可以像这样使用localStorage：

这只是一个例子

import React, { Component } from 'react';

const options = ["one", "two", "more", "set", "blah"]

class App extends Component {
  state = {
    selectedValue: localStorage.getItem("selectedValue") || null
  }

  onChange = (e) => {
    this.setState({ selectedValue: e.target.value });
    localStorage.setItem("selectedValue", e.target.value);
  }

  render() {
    const { selectedValue } = this.state;

    return (
      <select onChange={this.onChange} value={selectedValue ? selectedValue : options[0]}>
        {options.map((option, index) => <option key={index}>{option}</option>)}
      </select>
    );
  }
}

export default App;

import React，{Component}来自'React'；
常量选项=[“一”、“二”、“更多”、“设置”、“等等”]
类应用程序扩展组件{
状态={
selectedValue:localStorage.getItem（“selectedValue”）|| null
}
onChange=（e）=>{
this.setState（{selectedValue:e.target.value}）；
localStorage.setItem（“selectedValue”，即target.value）；
}
render（）{
const{selectedValue}=this.state；
返回(
{options.map（（选项，索引）=>{option}）}
);
}
}
导出默认应用程序；

---

这是一个粗略的示例，但它正在工作，请尝试调整它，直到它符合您的需要。

刷新页面时丢失状态值是正常的。但是你可以设置一些url查询参数，比如，然后在刷新页面时检查你是否在？SelectedCity中有任何内容。通过这种方式，您可以重新初始化所选的值。但是如何初始化呢@ivica.moket这是有道理的，但我想用另一种方法，只使用查询字符串和pros.location.search