mirror of
https://github.com/reactjs/react.dev.git
synced 2026-02-21 19:31:57 +00:00
Merge pull request #8 from yangshun/constructor-props
Ensure all class constructors call super with props
This commit is contained in:
@@ -89,8 +89,8 @@ Therefore we decided not to have this built-in into React's class model. You can
|
||||
|
||||
```javascript
|
||||
class Counter extends React.Component {
|
||||
constructor() {
|
||||
super();
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.tick = this.tick.bind(this);
|
||||
}
|
||||
tick() {
|
||||
|
||||
@@ -30,8 +30,8 @@ For example, say you have a `CommentList` component that subscribes to an extern
|
||||
|
||||
```js
|
||||
class CommentList extends React.Component {
|
||||
constructor() {
|
||||
super();
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.handleChange = this.handleChange.bind(this);
|
||||
this.state = {
|
||||
// "DataSource" is some global data source
|
||||
|
||||
@@ -200,8 +200,8 @@ First, add a constructor to the class to initialize the state:
|
||||
|
||||
```javascript{2-7}
|
||||
class Square extends React.Component {
|
||||
constructor() {
|
||||
super();
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
value: null,
|
||||
};
|
||||
@@ -228,8 +228,8 @@ Now the `<button>` tag looks like this:
|
||||
|
||||
```javascript{10-12}
|
||||
class Square extends React.Component {
|
||||
constructor() {
|
||||
super();
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
value: null,
|
||||
};
|
||||
@@ -282,8 +282,8 @@ Pulling state upwards like this is common when refactoring React components, so
|
||||
|
||||
```javascript{2-7}
|
||||
class Board extends React.Component {
|
||||
constructor() {
|
||||
super();
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
squares: Array(9).fill(null),
|
||||
};
|
||||
@@ -399,8 +399,8 @@ Try clicking a square – you should get an error because we haven't defined `ha
|
||||
|
||||
```javascript{9-13}
|
||||
class Board extends React.Component {
|
||||
constructor() {
|
||||
super();
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
squares: Array(9).fill(null),
|
||||
};
|
||||
@@ -528,8 +528,8 @@ Let's default the first move to be by 'X'. Modify our starting state in our Boar
|
||||
|
||||
```javascript{6}
|
||||
class Board extends React.Component {
|
||||
constructor() {
|
||||
super();
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
squares: Array(9).fill(null),
|
||||
xIsNext: true,
|
||||
@@ -564,8 +564,8 @@ After these changes you should have this Board component:
|
||||
|
||||
```javascript{6,11-16,29}
|
||||
class Board extends React.Component {
|
||||
constructor() {
|
||||
super();
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
squares: Array(9).fill(null),
|
||||
xIsNext: true,
|
||||
@@ -715,8 +715,8 @@ First, set up the initial state for Game by adding a constructor to it:
|
||||
|
||||
```javascript{2-10}
|
||||
class Game extends React.Component {
|
||||
constructor() {
|
||||
super();
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
history: [{
|
||||
squares: Array(9).fill(null),
|
||||
@@ -1006,8 +1006,8 @@ First, add `stepNumber: 0` to the initial state in Game's `constructor`:
|
||||
|
||||
```js{8}
|
||||
class Game extends React.Component {
|
||||
constructor() {
|
||||
super();
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
history: [{
|
||||
squares: Array(9).fill(null),
|
||||
|
||||
Reference in New Issue
Block a user