Skip to content

Commit 61ef3f1

Browse files
author
Vlad Balin
committed
Update BackboneViews.md
1 parent 5509b61 commit 61ef3f1

File tree

1 file changed

+4
-0
lines changed

1 file changed

+4
-0
lines changed

docs/BackboneViews.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -102,12 +102,16 @@ Therefore, it might be required to remove some items from the View's model.
102102

103103
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.
104104

105+
Keeping in mind these simple patterns, it's not that hard:
106+
105107
- `class` should be substitued with `className`
106108
- `<%= expr %>` -> `{ expr }`
107109
- `<%if( expr ){%> <div/> <%}%>` -> `{ expr && <div/> }`
108110
- `<%if( expr ){%> <div/> <%}else{%> <span/> <%}%>` -> `{ expr ? <div/> : <span/> }`
109111
- `<%for( var i = 0; i < arr.length; i++ ){%> <div/> <%}%>` -> `{ arr.map( ( x, i ) => <div key={ i } /> )}`
110112

113+
You should consult official React documentation for more information about this.
114+
111115
### Use Existing Model as component's state
112116

113117
If you already have one model, describing View's state (usual pattern is listening to model's `change` event and calling `this.render()`),

0 commit comments

Comments
 (0)