any operation inside jsx template gives NaN
sandeep-kr-kgp opened this issue · comments
<div>{[1,2,3].map(e=><span>{e}</span>)}</div>
works fine but <div>{[1,2,3].map(e=><span>{e*2}</span>)}</div>
does not. Am I missing something ?
Yes - we do not support any form of evaluation inside function declarations within the JSX. Simple functions are the only type supported, as added in #216
This lib does not act as a JS interpreter - so inline function creation is out-of-scope for a variety of reasons for this lib's target, primarily revolving around A) the complexities of evolving syntax and B) security.
To support what you're trying to do, I suggest creating a binding.
<JsxParser jsx="<div>{[1,2,3].map(renderChild)}</div>" bindings={{ renderChild: e => <span>{e*2}</span> }} />
This allows you to control the security implications around renderChild
in controlled code.