在React.js中從this.setState（）調用this.setState（）會不好嗎？

-1

例如，我有這樣的代碼：在React.js中從this.setState（）調用this.setState（）會不好嗎？

class Example extends Component { 
    constructor() { 
    super(); 
    this.state = { 
     value: "", 
     disabled: false, 
     isLoaderOpened: false 
    }; 
    } 

    render() { 
    return (
     <div> 
     <input 
      value={this.state.value} 
      onChange={this.onChange} 
      disabled={this.state.disabled} 
     /> 
     <button onClick={this.onClick}>Load</button> 
     {this.state.isLoaderOpened && <div>Loading</div>} 
     </div> 
    ); 
    } 

    onClick =() => this.fetchData(this.state.value); 

    onChange = e => this.setState({ value: e.target.value }); 

    fetchData = value => { 
    Promise.resolve() 
     .then(() => this.setState({ disabled: true },() => showLoader())) 
     .then(() => this.handleRequest(this.props.url, value)) 
     .then(res => 
     this.setState({ data: res.json() },() => this.hideLoader()) 
    ); 
    }; 

    showLoader =() => this.setState({ isLoaderOpened: true }); 

    hideLoader =() => this.setState({ isLoaderOpened: false }); 

    handleRequest = (url, value) => fetch(url + "?value=" + value); 
}

這樣做不好，我從setState函數調用，也使用setState？我想重複使用經常使用的方法，爲簡潔起見，將它們作爲setState中的回調傳遞是很舒服的。

來源

2017-08-17 Василий

爲什麼不只需在原始setState調用中設置打開的加載器？ – Neal

你可以在那裏設置你需要的狀態的所有部分，而不是調用一個相同的方法。不過，我會說，單獨使用「隱藏」和「顯示」方法是不好的。使用「切換」功能，根據需要傳遞「true」或「false」。 – jmargolisvt

@Neal因爲如果在某些地方我使用原始setState調用並在某個地方 - showLoader/hideLoader方法 –

將setState()稱爲兩次或更多次真的不好。在你的情況，你可以嘗試通過一個參數去的hideLoader()和showLoader() 例如：

showLoader = (otherState = {}) => this.setState({ ...otherState, isLoaderOpened: true }); 

hideLoader = (otherState = {}) => this.setState({ ...otherState, isLoaderOpened: false });

，那麼你可以通過另一種狀態，你想改變進入方法：

fetchData = value => { 
    Promise.resolve() 
     .then(() => this.setState({ disabled: true },() => showLoader())) 
     .then(() => this.handleRequest(this.props.url, value)) 
     .then(res => 
      this.hideLoader({ data: res.json() }) 
    ); 
};

來源

2017-08-18 05:02:02

在React.js中從this.setState（）調用this.setState（）會不好嗎？

回答

相關問題