@@ -33,7 +33,43 @@ obj.a = 2 // <· obj.a has changed to 2
3333
3434You can enjoy the benefits of proxy, for example` obj.a = { b: 5 } ` is effective.
3535
36- ##Use in react
36+ ##Use in react component
37+
38+ ``` typescript
39+ import {Action ,observable ,combineStores ,inject }from ' dob'
40+ import {Connect }from ' dob-react'
41+
42+ @observable
43+ export class UserStore {
44+ name= ' bob'
45+ }
46+
47+ export class UserAction {
48+ @inject (UserStore )private UserStore: UserStore ;
49+
50+ @Action setName () {
51+ this .store .name = ' lucy'
52+ }
53+ }
54+
55+ @Connect (combineStores ({
56+ UserStore ,
57+ UserAction
58+ }))
59+ class App extends React .Component {
60+ render() {
61+ return (
62+ < span onClick = {this.props.UserAction.setName }>
63+ {this .props .UserStore .name }
64+ < / span >
65+ )
66+ }
67+ }
68+ ```
69+
70+ > Use` inject ` to pick stores in action, do not` new UserStore() ` , it's terrible for later maintenance.
71+
72+ ##Use in react project
3773
3874``` typescript
3975import {Action ,observable ,combineStores ,inject }from ' dob'
@@ -75,8 +111,6 @@ ReactDOM.render(
75111,document .getElementById (' react-dom' ))
76112```
77113
78- > Use` inject ` to pick stores in action, do not` new UserStore() ` , it's terrible for later maintenance.
79-
80114##Project Examples
81115
82116- [ dob-react simple example] ( https://github.com/ascoders/dob-example )