Skip to content

Commit

Permalink
Fixed constructor -> componentDidMount in docs
Browse files Browse the repository at this point in the history
  • Loading branch information
mweststrate committed Jul 10, 2023
1 parent ef6a062 commit 3079cce
Show file tree
Hide file tree
Showing 3 changed files with 9 additions and 11 deletions.
8 changes: 2 additions & 6 deletions .changeset/flat-pumas-cross.md
Original file line number Diff line number Diff line change
@@ -1,12 +1,8 @@
---
"mobx-react-lite": patch
"mobx-react": major
---

- Fixed `observer` in `StrictMode` #3671

---

## "mobx-react": major

- Class component's `props`/`state`/`context` are no longer observable. Attempt to use these in any derivation other than component's `render` throws and error.
- **[BREAKING CHANGE]** Class component's `props`/`state`/`context` are no longer observable. Attempt to use these in any derivation other than component's `render` throws and error. For details see https://github.com/mobxjs/mobx/blob/main/packages/mobx-react/README.md#note-on-using-props-and-state-in-derivations
- Extending or applying `observer` classes is now explicitly forbidden
10 changes: 6 additions & 4 deletions packages/mobx-react/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -122,7 +122,9 @@ class Alerter extends React.Component<{ counter: number }> {

constructor(props) {
this.observableCounter = counter
}

componentDidMount() {
// set up a reaction, by observing the observable,
// rather than the prop which is non-reactive:
this.reactionDisposer = autorun(() => {
Expand All @@ -137,13 +139,13 @@ class Alerter extends React.Component<{ counter: number }> {
this.observableCounter = this.props.counter
}

render() {
return <div>{this.props.counter}</div>
}

componentWillUnmount() {
this.reactionDisposer()
}

render() {
return <div>{this.props.counter}</div>
}
}
```

Expand Down
2 changes: 1 addition & 1 deletion packages/mobx-react/src/observerClass.ts
Original file line number Diff line number Diff line change
Expand Up @@ -252,7 +252,7 @@ function createObservablePropDescriptor(key: "props" | "state" | "context") {
throw new Error(
`[mobx-react] Cannot read "${admin.name}.${key}" in a reactive context, as it isn't observable.
Please use component lifecycle method to copy the value into a local observable first.
See TODO doc link`
See https://github.com/mobxjs/mobx/blob/main/packages/mobx-react/README.md#note-on-using-props-and-state-in-derivations`
)
}
return admin[key]
Expand Down

0 comments on commit 3079cce

Please sign in to comment.