Node.js 我需要将用户输入作为get请求的一部分提交到unsplash服务器

是否可以在对unsplash服务器的get请求之前获取关键字，以便触发实时搜索？我想使用用户输入的关键字。这是我在前端的代码

class App extends Component {
  constructor () {
    super()

    this.state = {
      images: [],
      keyword: '',
      count: 15,
      start: 1
    }
  }

  componentDidMount() {
    const { count, start, keyword } = this.state;
    axios
      .get(`api/photos?count=${count}&start=${start}&keyword=${keyword}`)
      .then(res => this.setState({images: res.data.results}))
  }

  searchChange = (e) => {
    this.setState({ keyword: e.target.value })
  }

---

我不确定我是否正确理解了您的需求，但如果您想进行实时搜索，可以使用生命周期方法componentDidUpdate和shouldComponentUpdate，如下所示：

export default class App extends React.Component{
    constructor(){
        super()
        this.state = {
            images: [],
            keyword: '',
            count: 15,
            start: 1
        }
        this.searchChange = this.searchChange.bind(this)
    }
    shouldComponentUpdate(nextProps, nextState){
        return nextState.keyword != this.state.keyword
    }
    componentDidUpdate(){
        const { count, start, keyword } = this.state;
        axios
          .get(`api/photos?count=${count}&start=${start}&keyword=${keyword}`)
          .then(res => this.setState({images: res.data.results}))
    }
    searchChange(e) {
        this.setState({ keyword: e.target.value })
    }
    render(){
        return <div>
            <input type="text" onChange={this.searchChange} />
        </div>
    }
}

导出默认类App扩展React.Component{
构造函数（）{
超级（）
此.state={
图像：[]，
关键字：“”，
计数：15，
起点：1
}
this.searchChange=this.searchChange.bind（this）
}
shouldComponentUpdate（下一步，下一步状态）{
return nextState.keyword！=this.state.keyword
}
componentDidUpdate（）{
const{count，start，keyword}=this.state；
axios
.get（`api/photos？count=${count}&start=${start}&keyword=${keyword}`）
.then（res=>this.setState（{images:res.data.results}））
}
搜索更改（e）{
this.setState（{关键字：e.target.value}）
}
render（）{
返回
}
}

我不确定我是否正确理解了您的需求，但如果您想进行实时搜索，可以使用生命周期方法componentDidUpdate和shouldComponentUpdate，如下所示：

export default class App extends React.Component{
    constructor(){
        super()
        this.state = {
            images: [],
            keyword: '',
            count: 15,
            start: 1
        }
        this.searchChange = this.searchChange.bind(this)
    }
    shouldComponentUpdate(nextProps, nextState){
        return nextState.keyword != this.state.keyword
    }
    componentDidUpdate(){
        const { count, start, keyword } = this.state;
        axios
          .get(`api/photos?count=${count}&start=${start}&keyword=${keyword}`)
          .then(res => this.setState({images: res.data.results}))
    }
    searchChange(e) {
        this.setState({ keyword: e.target.value })
    }
    render(){
        return <div>
            <input type="text" onChange={this.searchChange} />
        </div>
    }
}

导出默认类App扩展React.Component{
构造函数（）{
超级（）
此.state={
图像：[]，
关键字：“”，
计数：15，
起点：1
}
this.searchChange=this.searchChange.bind（this）
}
shouldComponentUpdate（下一步，下一步状态）{
return nextState.keyword！=this.state.keyword
}
componentDidUpdate（）{
const{count，start，keyword}=this.state；
axios
.get（`api/photos？count=${count}&start=${start}&keyword=${keyword}`）
.then（res=>this.setState（{images:res.data.results}））
}
搜索更改（e）{
this.setState（{关键字：e.target.value}）
}
render（）{
返回
}
}