她是我的职责: searchHandler = ({ target: { value } }) => { this.setState({ term: value }); this.updateMessage(value); if(this.state.message.length === 0){ this.setState({hasMoreItems: false}) this.componentDidMount(); }else{ var requestUrl = 'https://questdb.herokuapp.com/all?q=' fetch(requestUrl + this.state.message).then((response)=>{ return response.json(); }) .then((data)=>{ this.setState({ tracks: data}); })}}updateMessage = message => this.setState({ message });您对我有什么建议吗?非常感谢! 解决方案通常,您要使用setState()的第二个参数,该参数接受将以更新状态运行的回调函数.这是一个示例:import React, { Component } from 'react';import { render } from 'react-dom';class App extends React.Component { state = { value: '', } handleChange = (e) => { e.preventDefault(); const { value } = e.target; this.setState({ value }, () => { console.log('Value is:', this.state.value ); }) } render() { return ( <input value={this.state.value} onChange={this.handleChange} /> ) }}render(<App />, document.getElementById('root'));实时示例此处.I am building a little search engine and got following problem:Everytime I enter a query, the last letter is missing. I figured out, that it has something to do with setState and that it is not asynchronous... But I can not come up with a solution fo my case.Her is my function: searchHandler = ({ target: { value } }) => { this.setState({ term: value }); this.updateMessage(value); if(this.state.message.length === 0){ this.setState({hasMoreItems: false}) this.componentDidMount(); }else{ var requestUrl = 'https://questdb.herokuapp.com/all?q=' fetch(requestUrl + this.state.message).then((response)=>{ return response.json(); }) .then((data)=>{ this.setState({ tracks: data}); })}}updateMessage = message => this.setState({ message });Do you have any suggestions for me?Thanks a lot! 解决方案 In general, you want to use the second argument of setState(), which accepts a callback function which will run with the updated state. Here's an example:import React, { Component } from 'react';import { render } from 'react-dom';class App extends React.Component { state = { value: '', } handleChange = (e) => { e.preventDefault(); const { value } = e.target; this.setState({ value }, () => { console.log('Value is:', this.state.value ); }) } render() { return ( <input value={this.state.value} onChange={this.handleChange} /> ) }}render(<App />, document.getElementById('root'));Live example here. 这篇关于React.js setState异步的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持! 上岸,阿里云! 08-01 02:22