programing

클래스는 React를 확장합니다.구성 요소가 반응에서 getInitialState를 사용할 수 없음

muds 2023. 3. 17. 22:02
반응형

클래스는 React를 확장합니다.구성 요소가 반응에서 getInitialState를 사용할 수 없음

Resact에서 ES6 구문을 처리하여 다음과 같은 컴포넌트를 작성합니다.

export default class Loginform extends React.Component {
    getInitialState() {
        return {
          name: '',
          password: ''
        };
    };
}

하지만 브라우저는 다음과 같은 문제를 제기합니다.

경고: getInitialState가 일반 JavaScript 클래스인 Loginform에 정의되었습니다.이것은 React.createClass를 사용하여 생성된 클래스에 대해서만 지원됩니다.대신 주 속성을 정의하시겠습니까?

전통적인 구문으로는 처리할 수 있습니다.var Loginform = React.createClass올바른 ES6 구문은 무엇일까요?

또 다른 작은 것은 전통적인 구문에서React.createClass오브젝트이기 때문에 그 안의 함수는 콤마로 구분되지만extends세미콜론이 필요한 수업인데 잘 모르겠어요.

ES6 클래스 메서드 선언 사이에는 세미콜론이나 쉼표가 필요하지 않습니다.

ES6 수업의 경우,getInitialState는 컨스트럭터에서 초기 상태 오브젝트를 선언하기 위해 폐지되었습니다.

export default class Loginform extends React.Component {
  constructor(props, context) {
    super(props, context);

    this.state = {
      name: '',
      password: ''
    };
  };
}

ES6 예: state, default Props, propType

import React from 'react'
import ReactDom from 'react-dom';
export default class Item extends React.Component{
    constructor(props){
        super(props);
        this.state = {
            check:false,
        };
        this.click=this.click.bind(this);
    }
    click(){
       this.setState({check:true});
    }
    render(){
        const text=this.state.check?'yes':'no';
        return(<div onClick={this.click}>{this.props.name} : <b>{text}</b></div>)
    }

}

Item.defaultProps={
    comment:"default comment",
};
Item.propTypes={
    name:React.PropTypes.string.isRequired,
};

class 필드를 사용하면 다음 기능이 작동합니다.

state = {
      name: '',
      password: ''
}

대신 사용할 수 있습니다.

constructor(props, context) {
    super(props, context);

    this.state = {
      name: '',
      password: ''
    };
  };

언급URL : https://stackoverflow.com/questions/33447149/class-extends-react-component-cant-use-getinitialstate-in-react

반응형