반응에서 상태 값을 변경하는 방법

React에서 상태 값을 변경하는 방법: 먼저 해당 React 코드 파일을 연 다음 React에서 제공하는 "this.setState({key name: value})" 메서드를 사용하여 상태 값을 수정합니다.

이 튜토리얼의 운영 환경: windows7 시스템, React17.0.1 버전, 이 방법은 모든 브랜드의 컴퓨터에 적합합니다.

관련 권장사항: "react 튜토리얼"

Changing the value of state in React

import React from 'react'
 
export default  class ClickS extends React.Component {
  constructor () {
    super()
    this.state= {
      msg: '123'
    }
  }
  render () {
    return <div>
      <button onClick={()=>this.show()}>按钮</button>
      <h2>{this.state.msg}</h2>
    </div>
  }
  show () {
    console.log(this)
    this.setState({
      msg: &#39;222&#39;
    })
  }
}

은 다음과 같이 작성할 수도 있습니다.

<button onClick={this.show.bind(this)}>按钮</button>
show () {
  console.log(this)
  this.setState({
    msg: &#39;222&#39;
  }, () => {
    console.log(this.state.msg) // 更新后的值222
  })
  console.log(this.state.msg) // 123
}

참고:

은 React 재할당의 상태, this.state.xxx = 값을 사용하지 마세요. 수정하려면 React에서 제공하는 this.setState({key name: value})를 사용해야 합니다.

this.state에 여러 값이 있고 그 중 하나만 수정해도 다른 값에는 영향을 미치지 않습니다. SetState는 해당 상태 값만 업데이트하고 다른 상태 값을 덮어쓰지 않습니다.

동시에 this.setState 메소드의 실행은 비동기적입니다. 그래서 최신 상태 값을 얻고 싶습니다. 콜백 함수를 전달해야 합니다.

위 내용은 반응에서 상태 값을 변경하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!