ਰਾਜ ਵਿੱਚ ਪ੍ਰਬੰਧਨ React- React ਐਪਲੀਕੇਸ਼ਨਾਂ ਵਿੱਚ ਗਤੀਸ਼ੀਲ ਡੇਟਾ ਨੂੰ ਸੰਭਾਲਣਾ

ਵਿੱਚ ਸਥਿਤੀ ਦਾ ਪ੍ਰਬੰਧਨ React ਗਤੀਸ਼ੀਲ ਡੇਟਾ ਨੂੰ ਸੰਭਾਲਣ ਅਤੇ ਉਪਭੋਗਤਾ ਇੰਟਰਫੇਸ ਨੂੰ ਸਮਕਾਲੀ ਕਰਨ ਦਾ ਇੱਕ ਮਹੱਤਵਪੂਰਨ ਪਹਿਲੂ ਹੈ। ਰਾਜ ਕਿਸੇ ਹਿੱਸੇ ਦੀ ਮੌਜੂਦਾ ਸਥਿਤੀ ਨੂੰ ਦਰਸਾਉਂਦਾ ਹੈ ਅਤੇ ਐਪਲੀਕੇਸ਼ਨ ਦੇ ਐਗਜ਼ੀਕਿਊਸ਼ਨ ਦੌਰਾਨ ਬਦਲ ਸਕਦਾ ਹੈ।

ਵਿੱਚ React, ਰਾਜ ਇੱਕ JavaScript ਵਸਤੂ ਹੈ ਜੋ ਮਹੱਤਵਪੂਰਨ ਜਾਣਕਾਰੀ ਰੱਖਦਾ ਹੈ ਜੋ ਇੱਕ ਹਿੱਸੇ ਨੂੰ ਸਮੇਂ ਦੇ ਨਾਲ ਸਟੋਰ ਅਤੇ ਸੰਸ਼ੋਧਿਤ ਕਰਨ ਦੀ ਲੋੜ ਹੁੰਦੀ ਹੈ। ਜਦੋਂ ਸਥਿਤੀ ਬਦਲਦੀ ਹੈ, ਤਾਂ React ਇਹਨਾਂ ਤਬਦੀਲੀਆਂ ਨੂੰ ਦਰਸਾਉਣ ਲਈ ਆਪਣੇ ਆਪ ਉਪਭੋਗਤਾ ਇੰਟਰਫੇਸ ਨੂੰ ਅਪਡੇਟ ਕਰਦਾ ਹੈ।

ਵਿੱਚ ਰਾਜ ਦਾ ਪ੍ਰਬੰਧਨ ਕਰਨ ਲਈ React, ਅਸੀਂ ਇੱਕ ਵਿਸ਼ੇਸ਼ ਸੰਪੱਤੀ ਦੀ ਵਰਤੋਂ ਕਰਦੇ ਹਾਂ ਜਿਸ ਨੂੰ ਕਿਹਾ ਜਾਂਦਾ ਹੈ state । ਅਸੀਂ ਕੰਪੋਨੈਂਟ ਦੇ ਕੰਸਟਰਕਟਰ ਵਿੱਚ ਰਾਜ ਦਾ ਐਲਾਨ ਕਰਦੇ ਹਾਂ ਅਤੇ ਇਸਦੇ ਸ਼ੁਰੂਆਤੀ ਮੁੱਲ ਨੂੰ ਸ਼ੁਰੂ ਕਰਦੇ ਹਾਂ। ਫਿਰ, ਅਸੀਂ ਵਿਧੀ ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਰਾਜ ਦੇ ਮੁੱਲ ਨੂੰ ਸੋਧ ਸਕਦੇ ਹਾਂ setState() ।

ਉਦਾਹਰਨ ਲਈ, ਆਓ ਇੱਕ ਸਧਾਰਨ ਕਾਊਂਟਰ ਕੰਪੋਨੈਂਟ 'ਤੇ ਵਿਚਾਰ ਕਰੀਏ:

import React, { Component } from 'react';  
  
class Counter extends Component {  
  constructor(props) {  
    super(props);  
    this.state = {  
      count: 0  
    };  
  }  
  
  incrementCount =() => {  
    this.setState(prevState =>({  
      count: prevState.count + 1  
    }));  
  }  
  
  render() {  
    return( 
      <div>  
        <p>Count: {this.state.count}</p>  
        <button onClick={this.incrementCount}>Increment</button>  
      </div>  
   );  
  }  
}  
  
export default Counter;

ਉਪਰੋਕਤ ਉਦਾਹਰਨ ਵਿੱਚ, ਅਸੀਂ count 0 ਦੇ ਸ਼ੁਰੂਆਤੀ ਮੁੱਲ ਦੇ ਨਾਲ ਇੱਕ ਅਵਸਥਾ ਦੀ ਘੋਸ਼ਣਾ ਕਰਦੇ ਹਾਂ। ਜਦੋਂ ਉਪਭੋਗਤਾ "ਇੰਕਰੀਮੈਂਟ" ਬਟਨ 'ਤੇ ਕਲਿੱਕ ਕਰਦਾ ਹੈ, ਤਾਂ ਵਿਧੀ ਦੀ count ਵਰਤੋਂ ਕਰਕੇ ਦਾ ਮੁੱਲ ਇੱਕ ਨਾਲ ਵਧਾਇਆ ਜਾਂਦਾ ਹੈ । setState()

ਮੈਨੇਜਿੰਗ ਸਟੇਟ ਸਾਨੂੰ ਮੌਜੂਦਾ ਸਥਿਤੀ ਦੇ ਆਧਾਰ 'ਤੇ ਕਿਸੇ ਕੰਪੋਨੈਂਟ ਦੀ ਸਮੱਗਰੀ ਅਤੇ ਵਿਵਹਾਰ ਨੂੰ ਬਦਲਣ ਦੀ ਇਜਾਜ਼ਤ ਦਿੰਦੀ ਹੈ। ਡਾਇਨਾਮਿਕ ਕੰਪੋਨੈਂਟ ਬਣਾਉਣ ਅਤੇ ਉਪਭੋਗਤਾ ਨਾਲ ਇੰਟਰੈਕਟ ਕਰਨ ਵੇਲੇ ਇਹ ਲਾਭਦਾਇਕ ਹੁੰਦਾ ਹੈ।