react（子传父、父传子） - 码农知识堂 - 文章详情页

react（子传父、父传子）
目录

1. 父传子数组/对象的两种写法

2. 子传父：

3. 生成唯一id的库：

4. 对接收的组件进行验证

1. 父传子数组/对象的两种写法
```
function App() {
  const obj = [{age:19},{age:19}]
  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <Header obj1 = {obj}/>
      header>
    div>
  );
}
```
第一种：

第二种：

2. 子传父：

子组件中： this.props.父子间传递给子组件的函数(需要传递的值)

父组件：利用porps传递一个函数：

最后父组件在fuc函数中利用形参接收子组件传过来的值

3. 生成唯一id的库：

uuid 安装： yarn add uuid

nanoid 较小，安装： yarn add nanoid

使用分别暴露的形式引用： import {nanoid} from 'nanoid'

具体使用： nanoid()

问： react如何动态的添加样式(ww)

4. 对接收的组件进行验证

porp-types

5. 状态在哪里，操作状态的方法就在那里；状态中的数据某一些组件使用，放在共同的父组件中（状态提升）；差分组件注意 className 和 style 的写法

6. 脚手架配置代理--方法

解决跨域问题：

1. 在package.json 中配置： ”proxy“ : "http://localxxxxx:3000"

2. 解决跨域、请求多个服务器的问题
相关阅读:
【Unity】3D贪吃蛇游戏制作/WebGL本地测试及项目部署
 AI视频监控平台EasyCVR接入海康SDK出现异常，该如何解决？
React报错之Objects are not valid as a React child
软件项目尾期，客户提新需求怎么办？
助力物流业发展2024长三角快递物流供应链与技术装备展于四月召开
 vue.js生命周期函数
 打怪升级（考验思路）
【大模型LLM面试合集】大语言模型架构_MoE经典论文简牍
 java毕业生设计校园闲置物品交换平台系统计算机源码+系统+mysql+调试部署+lw
Python零基础提问，如何获取下拉菜单中的数据和文本？
原文地址：https://blog.csdn.net/qq_52179917/article/details/127966037