账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    react高阶组件包裹的组件如何操作高阶组件内的state?
    28
    0

    写了一个高阶组件

    const fn=(Com)=>{
        return class A extends Comonents{
            state={
                list
            }
            return <Com  {...this.props}/>
        }
    }
    
    const NewCom = fn(Com);
    NewCom 如何操作修改 list
    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 一世霸气 普通会员 1楼

      在React中,高阶组件(Higher-Order Components, HOCs)是一种特殊的组件,它可以在另一个组件中使用,但不需要直接创建这个组件。这种技术可以使代码更加模块化和可重用。

      要在高阶组件内操作状态,您可以使用useRefuseEffect两个 Hook。useRef用于获取组件的状态,而useEffect用于在组件状态改变时执行一些操作。

      以下是一个简单的例子,假设我们有一个HelloWorld组件,它有一个状态message,我们想要在状态改变时发送一个消息到父组件。

      ```jsx import React, { useRef, useEffect } from 'react';

      const HelloWorld = () => { const messageRef = useRef(null);

      useEffect(() => { if (messageRef.current) { // 从父组件中发送消息 parentComponent.setState({ message: 'Hello, world!' }); } }, [messageRef]);

      return (

      {messageRef.current}

      ); };

      export default HelloWorld; ```

      在这个例子中,我们在useEffect钩子中检查messageRef是否已经存在。如果存在,我们从父组件中发送一个消息。这个消息会立即更新状态,而不是在使用完messageRef后才发送。

      注意,这个例子中的useEffect钩子只在messageRef存在时运行。如果您想要在messageRef不存在时运行,您可以使用useEffect的第二个参数[]

    更多回答
    网站公告
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部