Reactjs gradually deepen understanding

Reactjs

React.render (parameter 1, Parameter 2) uses:

Role: inserting label content into the target DOM node in the page

Description

Parameter 1:html the existence of the label pair (can contain content), such as <span> This is the label content </span> It can also be a component that has been created through React.createclass (which can actually be understood as a label), and if you create a component named Zujian1, the parameter 1 here needs to be in the form of a label,<zujian1></zujian1> (Note that the first letter of the component name must be uppercase and how it will be created below)

Parameter 2: The page Dom target, that is, this first parameter refers to the tag and the content will be inserted into this position of the page, such as inserted into the page ID example1 of the DOM node:d Ocument.getelementbyid (' example1 ')

For example use:

Will <span> this is the label content </span> insert into the page the node with ID example1:

React.render (<span> This is the label content </span>, document.getElementById (' example1 '));

To create a component:

Use the React.createclass () method;

Usage notes:

var component name = React.createclass ({

Render:function () {

Return <p> component 1 content </p>

}

})

Pay special attention to the first letter of the component name must be capitalized, such as the component name: Zujian1 will not play any role, need to write Zujian1

Specific usage:

 <div id= "example1" ></div><div id= "example2" ></div><script type= "TEXT/JSX" > Span style= "color: #0000ff;" >var  Zujian1 = React.createclass ({render:  function   { return  <p>    Content 1</p> <zujian1></zujian1>, document.getElementById (' example1 ')); var  Zujian2 = React.createclass ({render:  function< /span> () {  <zujian2></zujian2>, document.getElementById (' example2 ')); </script> 

The results of the page will be output (of course, the two contents are in id= ' example1 ' and id= ' example2 ' div):

Content 1

Content 2

Reactjs gradually deepen understanding