惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

人人都是产品经理
人人都是产品经理
有赞技术团队
有赞技术团队
WordPress大学
WordPress大学
月光博客
月光博客
T
Tailwind CSS Blog
阮一峰的网络日志
阮一峰的网络日志
小众软件
小众软件
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
Last Week in AI
Last Week in AI
大猫的无限游戏
大猫的无限游戏
S
SegmentFault 最新的问题
罗磊的独立博客
Jina AI
Jina AI
酷 壳 – CoolShell
酷 壳 – CoolShell
宝玉的分享
宝玉的分享
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
博客园 - 三生石上(FineUI控件)
量子位
雷峰网
雷峰网
Apple Machine Learning Research
Apple Machine Learning Research
美团技术团队
博客园 - 聂微东
V
V2EX

博客园 - work hard work smart

Java 常见面试问题 手撕java常用代码 构建企业级 Text-to-SQL Agent:基于 LangGraph 的智能数据查询系统设计 Harness 工程:驾驭 AI Agent 的工程化艺术 DeepAgents 多智能体架构实战:从设计模式到后端选型 Vue 自定义组件完全指南:从零构建待办事项应用 使用 LangChain + Hugging Face 构建文本向量化服务 SQLAlchemy 使用详解 Python 中使用 Elasticsearch 的完整指南 Qdrant 向量数据库使用指南 OpenEvals 快速入门:LLM 评估指南 DeepEval 快速入门:LLM 应用评估指南 LangSmith 批量评估完全指南 Qwen-Agent 入门指南:快速构建智能体应用 LangSmith 集成实战:从追踪到评估的完整指南 初识 go-zero:一款让你写后端更规范、更高效的 Go 微服务框架 RAG 中为什么需要 Rerank,以及如何使用 Rerank LangChain4j RAG 核心组件与组合方式 如何使用 Elasticsearch 进行全文检索和向量检索 MinerU Docker 部署指南 5 分钟上手:为 Cline 配置一个免费的 MCP 天气服务 Neo4j 图数据库安装与 Spring Boot 集成实战指南 LangFuse 实战指南:用 @observe 三行代码给 LLM 应用加上全链路追踪 Function Call 深度解析:让大模型从"嘴炮"到"实干"的技术革命 Spring AI 提示词模板实战:告别硬编码,实现提示词工程化管理 LangChain4j 实战指南:用 Java 轻松构建 AI 应用 Spring AI 对话短期记忆实战:让大模型拥有"记忆力" Spring AI 提示词工程实战:让大模型更懂你的意图 Spring AI ChatClient 深度解析:优雅构建大模型应用的利器 Spring AI Alibaba DashScopeChatModel 实战
WebStorm 创建react工程
work hard work smart · 2026-08-30 · via 博客园 - work hard work smart

工程名称为reactdemojs

image

 文件结构如下

image

创建一个父组件和子组件

父组件为

import React from  "react";

import Child from "./Child";

export default class Life  extends React.Component{

    constructor(props) {
        super(props);
        this.state = {
            count:0
        };
    }

    handleAdd=() => {
        this.setState(
            {
                count: this.state.count +=1
            }
        )
    }

    render() {
        return <div>
            <p>react生命周期 这里是父组件</p>
            <button onClick={this.handleAdd}>点击一下</button>
            <p>{this.state.count}</p>
            <Child name="Tom" ></Child>
        </div>
    }

}

子组件为Child

import React from  "react";

export default class Child  extends React.Component{

    constructor(props) {
        super(props);
        this.state = {
            count : 0
        }
    }

    componentDidMount() {
        console.log("did mount");
    }


    shouldComponentUpdate(nextProps, nextState, nextContext) {
       console.log("should update")
        return true;
    }



    render() {
        return <div>
            <p>这里是子组件</p>
            <p>{this.props.name}</p>
        </div>
    }

}

运行后效果为

image