सेटस्टेट तुरंत राज्य को अपडेट नहीं करता

Question

मैं पूछना चाहता हूं कि जब मैं ऑनक्लिक ईवेंट करता हूं तो मेरा राज्य क्यों नहीं बदल रहा है। मैंने थोड़ी देर पहले खोज की है कि मुझे कन्स्ट्रक्टर में ऑनक्लिक फ़ंक्शन को बांधना होगा लेकिन फिर भी राज्य अपडेट नहीं हो रहा है।

import React from 'react'; 

import Grid from 'react-bootstrap/lib/Grid'; 
import Row from 'react-bootstrap/lib/Row'; 
import Col from 'react-bootstrap/lib/Col'; 

import BoardAddModal from 'components/board/BoardAddModal.jsx'; 

import style from 'styles/boarditem.css'; 

class BoardAdd extends React.Component { 

    constructor(props){ 
     super(props); 

     this.state = { 
      boardAddModalShow: false 
     } 

     this.openAddBoardModal = this.openAddBoardModal.bind(this); 
    } 
    openAddBoardModal(){ 
     this.setState({ boardAddModalShow: true }); 
// After setting a new state it still return a false value 
     console.log(this.state.boardAddModalShow); 

    } 

    render() { 

     return (
      <Col lg={3}> 
       <a href="javascript:;" className={style.boardItemAdd} onClick={this.openAddBoardModal}> 
        <div className={[style.boardItemContainer,style.boardItemGray].join(' ')}> 
         Create New Board 
        </div> 
       </a> 



      </Col> 
     ) 
    } 
} 

export default BoardAdd 

Answer 1

आप राज्य उत्परिवर्तित के लिए कुछ समय की जरूरत है और के बाद से अपने console.log(this.state.boardAddModalShow) बयान राज्य mutates से पहले निष्पादित करता है, तो आप आउटपुट के रूप में पिछले मान मिलता है: यहाँ मेरी कोड है। तो तुम setState समारोह

openAddBoardModal(){ 
     this.setState({ boardAddModalShow: true }, function() { 
      console.log(this.state.boardAddModalShow); 
     }); 

} 

setState अतुल्यकालिक है कॉलबैक में सांत्वना लिखने के लिए की जरूरत है। इसका मतलब है कि आप एक लाइन पर सेटस्टेट को कॉल नहीं कर सकते हैं और मान लें कि राज्य अगले में बदल गया है।

React docs

setState() के अनुसार तुरंत this.state उत्परिवर्तित नहीं है

लेकिन एक लंबित स्थिति संक्रमण पैदा करता है। इस विधि को कॉल करने के बाद this.state तक पहुंचने से संभावित रूप से मौजूदा मान वापस आ सकता है। सेटस्टेट पर कॉल के सिंक्रोनस ऑपरेशन की कोई गारंटी नहीं है और कॉल प्रदर्शन लाभ के लिए बैच किए जा सकते हैं।

वे setState async क्यों बनाना होगा

इसका कारण यह है setState राज्य को बदल देता है और rerendering का कारण बनता है। यह एक महंगा ऑपरेशन हो सकता है और इसे सिंक्रोनस बनाने से ब्राउज़र को ब्राउज़र अप्रतिबंधित छोड़ सकता है।

इस प्रकार सेटस्टेट कॉल एसिंक्रोनस के साथ-साथ बेहतर यूआई अनुभव और प्रदर्शन के लिए बैच किए गए हैं।