如何将参数传递给上下文 Reactjs 中的函数

Question

我需要从另一个组件调用 Context 中的参数化函数。下面是代码sn-p。

上下文

Sortdata=(id)=> {
        console.log("passed from homepage",id)
         if(this.state.data>parseInt(id)){
        recorddata.sort((a,b)=>{
            let da = new Date(a.inspectioN_DT),
            db = new Date(b.inspectioN_DT);
        return da - db;}
    });
        console.log(recorddata);
        this.setState({
            listvalues: recorddata
        })
    }

 render() { 
        return ( 
            <DataContext.Provider value={{...this.state, sortData: this.Sortdata }}>
                {this.props.children}
            </DataContext.Provider>
           
         );
    }

我需要从我的主组件调用上述函数 Sortdata()。请建议我一种调用此函数的方法或使用反应上下文本身的替代方法。提前致谢。

Answer 1

首先创建你的上下文

const DataContext= React.createContext('');

传入你已经做的值（即带有函数的对象）

 <DataContext.Provider value={{...this.state, sortData: this.Sortdata }}>

访问上下文（必须在提供者内部）

const value = useContext(DataContext);

调用函数示例：

value.sortData(3);

查看更多信息：https://reactjs.org/docs/hooks-reference.html#usecontext 和 https://reactjs.org/docs/context.html