Frage Reagieren - So greifen Sie auf Requisiten zu, ohne den Konstruktor zu verwenden


Hinweis: Ich stoße auf dieses spezielle Problem, wenn ich Native React benutze, aber ich denke, das gilt auch für React im Allgemeinen.

Ich habe eine Reaktionskomponente, die mit React.Component erstellt wurde. Ich brauche keinen Staat, aber ich habe Requisiten. Meine vorgeschlagene Syntax war wie folgt:

class Header extends Component {
  constructor(props) {
    super(props);
  }
  render() {
    return <div>{this.props.title}</div>;
  }
}

Ich verstehe, dass ich eine Funktion verwenden kann, um diese Komponente wie folgt zu konstruieren:

const Header = (props) => {
  return <div>{props.title}</div>;
}

Aber ich bevorzuge das erstere, weil meine Komponente wachsen wird, einen Zustand usw. haben kann, und ich möchte nur alle meine Komponenten in einer ähnlichen Weise bauen lassen.

Nun, mein Linter beschwert sich über einen nutzlosen Konstruktor, aber wie sonst kann ich auf die Requisiten zugreifen, während ich einen Klassenkonstruktor anstelle eines Funktionskonstruktors behalte?


5
2017-10-19 18:03


Ursprung


Antworten:


Wenn Sie this.props im Konstruktor verwenden möchten, müssen Sie requisiten an super übergeben. Andernfalls spielt es keine Rolle, da React direkt nach dem Aufruf des Konstruktors die Prozedur von außen auf die Instanz setzt.

Also einfach Konstruktor () entfernen, wenn unbrauchbar


9
2017-10-19 18:09



Sie können Requisiten ohne Konstruktor in einer Klasse mit "this" wie folgt aufrufen:

class XXXXXX extends React.Component {
   render() {
       return (
          <div>{this.props.value}</div>
       )
   }
}

1
2017-10-21 08:36