CODEWITHSUNDEEP
jsonreactjs
Surbhi Gupta
Surbhi Gupta

Reputation: 91

pass JSON string to create tag React.createelement

I have a JSON string created by API:

var appStructure = {
    "code": 200,
    "message": "Register Form Loaded.",
    "response": "'div',{},'Registration'"
};

I want to create element dynamically using the API response. I am trying to do something like this:

var testCard1 = React.createElement(appStructure.response);
ReactDOM.render(testCard1, document.getElementById('main-content'));

But it keep giving me the error

Warning: is using incorrect casing. Use PascalCase for React components, or lowercase for HTML elements. Uncaught DOMException: Failed to execute 'createElement' on 'Document': The tag name provided ('h1',{},'Hello Testing') is not a valid name.

Upvotes: 2

Views: 548

Answers (1)

Metalik
Metalik

Reputation: 943

appStructure.response is string and can't be passed into createElement method as arguments. You should change string to acceptable arguments. Also testCard1 should be in PascalCase: TestCard1

var args = appStructure.response.split(',');
var TestCard1= React.createElement(args[0].replace(/\W/g, ''), JSON.parse(args[1]), args[2].replace(/\W/g, ''));

Upvotes: 2

Related Questions