1616const UserModel = Backbone .Model .extend ();
1717const UserCollection = Backbone .Collection .extend ({ model: UserModel });
1818
19- const userInstance = new UserModel ({ name: ' Harry' , laughs: true });
20- const anotherUserInstance = new UserModel ({ name: ' Samantha' , laughs: false });
19+ const userInstance = new UserModel ({ name: " Harry" , laughs: true });
20+ const anotherUserInstance = new UserModel ({ name: " Samantha" , laughs: false });
2121const userCollection = new UserCollection ([userInstance, anotherUserInstance]);
2222
2323class MyComponent extends React .Component {
2424 render () {
2525 return (
2626 < div>
27- < p>
28- My user laughs : { this . props . doesUserLaugh ? " yes " : " no " }
29- < / p >
30- < button onClick = {() => this . props . setUserLaughs ( ! this . props . doesUserLaugh )} >
27+ < p> My user laughs : { this . props . doesUserLaugh ? " yes " : " no " } < / p >
28+ < button
29+ onClick = {() => this . props . setUserLaughs ( ! this . props . doesUserLaugh )}
30+ >
3131 Toggle Laughing User
3232 < / button>
3333 < h4> All Users< / h4>
@@ -50,13 +50,13 @@ const mapModelsToProps = (models, props) => {
5050
5151 // Everything returned from this function will be given as a prop to your Component.
5252 return {
53- doesUserLaugh: user .get (' laughs' ),
54- users: showOnlyLaughingUsers ?
55- allUsers .toJSON ().filter (user => user .laughs === true ) :
56- allUsers .toJSON (),
53+ doesUserLaugh: user .get (" laughs" ),
54+ users: showOnlyLaughingUsers
55+ ? allUsers .toJSON ().filter (user => user .laughs === true )
56+ : allUsers .toJSON (),
5757 setUserLaughs (newVal ) {
58- user .set (' laughs' , newVal);
59- },
58+ user .set (" laughs" , newVal);
59+ }
6060 };
6161};
6262
@@ -70,7 +70,7 @@ const options = {
7070 // that will cause your React Component to re-render.
7171 // By default it's ['all'] for every Model and Collection given.
7272 events: {
73- user: [' change:name' , ' change:laughs' ],
73+ user: [" change:name" , " change:laughs" ]
7474 // You can disable listening to events by passing in `false` or an empty array.
7575 },
7676
@@ -80,20 +80,23 @@ const options = {
8080 // By default no modelTypes are defined.
8181 modelTypes: {
8282 user: UserModel,
83- allUsers: UserCollection,
83+ allUsers: UserCollection
8484 },
8585
8686 // Enable access to the wrapped component's ref with the `withRef` option.
8787 // You can then access the wrapped component from the connected component's `getWrappedInstance()`.
8888 // This is similar to react-redux's connectAdvanced() HOC.
8989 // By default, `withRef` is false.
90- withRef: true ,
90+ withRef: true
9191};
9292
93- const { connectBackboneToReact } = require (' connect-backbone-to-react' );
93+ const { connectBackboneToReact } = require (" connect-backbone-to-react" );
9494
9595// Create our Connected Higher order Component (HOC).
96- const MyComponentConnected = connectBackboneToReact (mapModelsToProps, options)(MyComponent);
96+ const MyComponentConnected = connectBackboneToReact (
97+ mapModelsToProps,
98+ options
99+ )(MyComponent);
97100```
98101
99102Now that you've created your HOC you can use it!
@@ -103,13 +106,13 @@ Now that you've created your HOC you can use it!
103106// your mapModelsToProps function.
104107const modelsMap = {
105108 user: userInstance,
106- allUsers: userCollection,
109+ allUsers: userCollection
107110};
108111
109112ReactDOM .render (
110113 // Pass the modelsMap to the HOC via the models prop.
111114 < MyComponentConnected models= {modelsMap} showOnlyLaughingUsers= {true } / > ,
112- document .getElementById (' app' )
115+ document .getElementById (" app" )
113116);
114117```
115118
@@ -150,6 +153,14 @@ To develop this library locally, run the following commands in the project root
150153
151154Run ` npm test ` to run the unit tests.
152155
156+ ### Releasing a new version
157+
158+ 1 . Make sure you have up to date ` node_modules ` before you proceed. Can be done via ` npm ci `
159+ 2 . Update the version via: ` npm run release -- --release-as=major|minor|patch `
160+ 3 . Optionally manually edit the revised ` CHANGELOG.md ` file. Commit changes.
161+ 4 . Follow the directions from step 2: run ` git push --follow-tags origin master; npm publish ` to publish
162+ 5 . Rejoice!
163+
153164## License
154165
155166Apache 2.0
0 commit comments