Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

React Native equivalent of React.createElement

When looking at React, specifically React (Virtual) DOM terminology I am wondering whether there is an equivalent for React Native, or rather, how this can be modified for use with Native?

I am wanting to compose a view, it consists of a <Text> <TouchableHighlight> <TouchableHighlight> . The two <TouchableHighlight>elements will increment and decrement a counter (the <Text> label).

Is there a way I can perhaps pass these are parameters into a function similar to React.createElement that will return a view with these elements in?

like image 345
Tom Hanson Avatar asked Nov 12 '15 10:11

Tom Hanson


People also ask

Can you use createElement in React?

createElement()Create and return a new React element of the given type. The type argument can be either a tag name string (such as 'div' or 'span' ), a React component type (a class or a function), or a React fragment type. Code written with JSX will be converted to use React.createElement() .

What is the difference between createElement and cloneElement?

createElement is the code that JSX gets compiled or converted into and is used by reacting to create elements. cloneElement is used for cloning elements and passing them new props. This method is used to describe how the User Interface looks. This method is used to manipulate the elements.

What is the tool used to take JSX and turn it into createElement?

Explanation: The Babel is the tool used to turn into createElement calls also babel is a transpiler that is conversion.

Can we use JSX in react native?

React and React Native use JSX, a syntax that lets you write elements inside JavaScript like so: <Text>Hello, I am your cat! </Text> . The React docs have a comprehensive guide to JSX you can refer to learn even more. Because JSX is JavaScript, you can use variables inside it.


1 Answers

createElement is also available on React Native. So you can do:

var textElem = React.createElement(Text, [], ['Hello world']);

You must supply a ReactClass as first parameter, strings are not allowed as the first parameter in React Native since those are meant to be used for html tags in regular React.

like image 143
Emilio Rodriguez Avatar answered Oct 07 '22 23:10

Emilio Rodriguez