when we are proficient in using React for front-end development, we will inevitably have a strong interest in the internal mechanism of React. What are the components? Is it the real DOM? What is the basis for the execution of lifecycle functions? in this article, let's first study the implementation and mounting of React components. 1. What is the component first write the simplest component: after the above code is written, we get the & lt;A / & gt; component, so let's figure out what & lt;A / & gt; is. Print it out with console.log : you can see that & lt;A / & gt; is actually a js object rather than a real DOM. Notice that props is an empty object at this time. Next, let's print & lt;A> , which is component A & lt;/div> , and see what the console outputs: We see that props has changed. Because div and div are nested in the & lt;A / & gt; component, the children attribute is added to the props describing the & lt;A / & gt; object, whose value is the js object describing div . By the same token, if we do multi-level component nesting, we are actually adding children fields and corresponding description values to the props of the parent object, that is, the multi-level nesting of js objects. the above description is based on the React development model of ES6. In fact, the components created by the React.createClass ({}) method in ES5 are exactly the same as those in ES6, and can also…