React

React勉強中_メモ

覚書です。

構文

class なんとか extends Component

class Componentのお決まりの構文
その後に設定する各コンポーネントが基底クラスの扱いになる(ということかな?)

class なんとか extends Component {
 constructor(props){
  super(props);//各コンポーネントの値 受け取り専用 名前固定
  this.state = {//このクラスに設定する値 名前固定 インスタンス変数だね
   キー:null //初期値なければnullを入れとく
  };
 }
 メソッド(){
 //任意のメソッド
  this.setState({キー:新しい値});//stateを更新する際は.setState()
 }
 render(){
  <コンポーネント></コンポーネント>//この後で任意に設定する
 <コンポーネント 任意の属性={this.state.キー}>
 </コンポーネント>
 }
}

エラー / ESLint

'なんちゃら' is defined but never used no-unused-vars

変数'なんちゃら'を定義してるけどそれ使ってないよ
引数もひっかかる

'パラメータ名' is missing in props validation react/prop-types

パラメータ(プロパティ?props?何が何だか)のバリデーションしてね
(下記コード参照)
してるよ!!!!と思ったらタイプミスしてた…

コンポーネント.propTypes = {
 パラメータ名:PropTypes.型,
 パラメータ名:PropTypes.型.isRequired//パラメータが必須の場合
};

型の種類

  • PropTypes.array //配列
  • PropTypes.bool //論理値
  • PropTypes.func //関数
  • PropTypes.number //数値
  • PropTypes.object //オブジェクト
  • PropTypes.string //文字列