You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/BackboneViews.md
+16-1Lines changed: 16 additions & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -45,7 +45,7 @@ dealing with small isolated parts of the code first.
45
45
Or, you can decide to start refactoring from the top. In this case, you will likely want to reuse
46
46
your existing lower-level backbone subviews.
47
47
48
-
You can do it like that. And it will work okay.
48
+
You can do it like that.
49
49
50
50
```javscript
51
51
var React = require( 'nestedreact' );
@@ -65,6 +65,8 @@ var MyComponent = React.createClass({
65
65
});
66
66
```
67
67
68
+
It's easy, for example, to take [react-router](https://github.com/reactjs/react-router) and use it in your application without any changes in Backbone View layer.
69
+
68
70
Taking these two features together, you can take literally any view from the subview hierarchy, and replace it with
69
71
React component. It will also work fine if there are multiple layers - React using Backbone using React...
70
72
@@ -96,6 +98,19 @@ View's state model.
96
98
In Backbone, you might assign values from `options` to the model. Do not do this with React. Remember, `options` is `props`.
97
99
Therefore, it might be required to remove some items from the View's model.
98
100
101
+
### Converting EJS template to JSX
102
+
103
+
I will assume we're using EJS to be specific. JSX is not text, it's hidden JS tree construction expression, thus control structures must be transformed to functional form. In short, branches becomes logical expressions, loops becomes `map` expressions. Expression must return single node or array, in the last case you're required to add `key` attribute. Component must return single node at the top level.
0 commit comments