React学习笔记4

Posted 2020-07-26

遇到的问题

目前模板是自己任意定义的，样式不好控制 在组件设计时，可以把页面数据显示的地方，分割父子组件嵌套的结构，比如，商品数据显示列表，把组外层容器看成是父组件，里面是数据显示的渲染模板，看成是子组件

 

做数据交互

1.实现父子组件的分离---父组件请求data，子组件解析

2.实现在父组件中，生命周期函数中请求ajax，得到数据后，先存在父组件的state中，再把state传递给子组件的props

3.在子组件中解析和打印数据

4.在父组件中控制子组件的叠加，最后将叠加结果通过父组件渲染到页面中

 

Mixins

Mixins是React组件中提供出的一个属性

在开发中很多功能（JS函数构成的模块）存在共性，将公共函数抽取，通过Mixins来使用

首先将公共的函数提取出来，放在一个Object中，这些方法提取出来以后的类型也是Object方法类型

使用:在需要调用公共方法的组件中，通过mixins:[commonApis]把commonApis对象中的方法都挂载到该组件的原型链上

在组件中要是用这些方法，只需要onChange={this.checkInput}即可