1

I have 2 request html: <div>{{name}}</div> json {"name": "Vasya"} How with React parse this data and return <div>Vasya</div> ?

module.exports = React.createClass({
 getInitialState: function () {
     return {
        previewData: {}, //  {"name":"Vasya"}
        previewHtml: {}  //  "<div>{{name}}</div>"
},
getTemplateDataStore: function (event, previewData) {
    this.setState({
        previewData: previewData
    });
},

getTemplateHTMLStore: function (event, previewHtml) {
    this.setState({
        previewHtml: previewHtml
    });
},
render: function () {
    return // ?????????? need return <div>Vaysa</div>? 
}
},

});

Caesar
  • 187
  • 2
  • 10
  • 2
    Why are you using a template system with react? Why not directly use the JSX syntax? Either way, "parsing" this has nothing to do with react. You can use your template system to render the data and template to HTML and then set that HTML as content of the root element. But again, there isn't really any reason to do this. You give up all the advantages of react and JSX. – Felix Kling Sep 29 '15 at 13:32
  • `this.state.previewData.name` would give you Vasya – knowbody Sep 29 '15 at 13:33
  • server return me a handlebars template , so I need parse it. – Caesar Sep 29 '15 at 13:37
  • `render: function () { var template = Handlebars.compile("
    {{name}}
    "); var context = {"name": "Vasya"}; //var html = template(context); return
    {template(context)} // why return string NOT DOM element?
    }`     – Caesar Sep 29 '15 at 13:46
  • Read the docs: https://facebook.github.io/react/tips/dangerously-set-inner-html.html . Also see this related question: [render html in state string](http://stackoverflow.com/q/29189559/218196) – Felix Kling Sep 29 '15 at 17:19

0 Answers0