世界即时看!#yyds干货盘点# react笔记之学习之props父子传值

2022-12-12 15:21:56 来源:51CTO博客


(资料图片)

前言

我是歌谣 我有个兄弟 巅峰的时候排名c站总榜19 叫前端小歌谣 曾经我花了三年的时间创作了他 现在我要用五年的时间超越他 今天又是接近兄弟的一天人生难免坎坷 大不了从头再来 歌谣的意志是永恒的 放弃很容易 但是坚持一定很酷 微信公众号前端小歌谣

父子组件传值 日期组件data.js

import React from "react";import MyDate from "./MyDate/MyDate";import "./LogItem.css"const LogItem = (props) => {    // 在函数组件中,属性就相当于是函数的参数,可以通过参数来访问    // 可以在函数组件的形参中定义一个props,props指向的是一个对象    // 它包含了父组件中传递的所有参数    // console.log(props);    return (        
{/* 日志内容的容器 */}
{/* 如果将组件中的数据全部写死,将会导致组件无法动态设置,不具有使用价值 我们希望组件数据可以由外部设置,在组件间,父组件可以通过props(属性)向子组件传递数据 */}

{props.desc}

{props.time}分钟
);};export default LogItem;

父组件

/* 日志的容器 */import LogItem from "./LogItem/LogItem";import "./Logs.css";const Logs = () => {  return 
{/*在父组件中可以直接在子组件中设置属性*/} {/*{}} />*/}
};export default Logs;

标签: 使用价值 设置属性 一个对象

上一篇:技术干货 | 漫游Linux块IO
下一篇:世界观焦点:【秒杀购物商城业务服务】「分布式架构服务」盘点中间件服务的高可用模式及集群技术的方案分析