React Study Notes 4

problems encountered

At present, the template is self-defined, the style is not good control in the component design, you can put the page data display place, split parent-child component nested structure, for example, the product data display list, the group of the outer container as a parent component, which is the data display of the rendering template, as a sub-component

 Do data interaction

1. Implementing the separation of parent-child components---Parent component request data, sub-component parsing

2. Implementation in the parent component, the life cycle function in the request Ajax, the data is obtained, the parent component of the state, and then pass the state to the props of the child component

3. Parsing and printing data in subcomponents

4. Control the overlay of the subassembly in the parent component, and finally render the overlay result to the page through the parent component

 mixins

Mixins is a property provided in the React component

In the development of many functions (JS function composed of modules) there is commonality, the public function extraction, through the mixins to use

First, the public functions are extracted and placed in an object, which are extracted from the type of the object method.

Use: To mount the methods in the Commonapis object to the component's prototype chain by Mixins:[commonapis] in the component that calls the public method.

If you use these methods in your component, you need only onchange={this.checkinput}.

React Study Notes 4