我只是尝试使用 React 提供程序,但不知何故我收到此错误:index.js:1437 警告:上下文使用者使用多个子项或不是函数的子项进行渲染。上下文使用者期望有一个作为函数的子级。如果您确实传递了一个函数,请确保它周围没有尾随或前导空格。
这是 context.js
import React, { Component } from 'react'
const Context=React.createContext()
class Providerr extends Component {
state={display:false}
displayeditor=()=>{this.setState({display:!this.state.display}) }
render() { return (
<Context.Provider value={{...this.state,displayeditor:this.displayeditor }}>
{this.props.children}
</Context.Provider>
)
}
}
const Consumer=Context.Consumer
export {Providerr,Consumer}
Run Code Online (Sandbox Code Playgroud)
我想在下面使用它
import React, { Component } from 'react'
import {NavLink} from "react-router-dom"
import "./leagues.scss"
import {Consumer} from "./context.js"
export default class Navbar extends Component {
render() {
return (
<nav className="navbar navbar-expand-lg">
<a className="navbar-brand" href="#Home">
<img src="./images/customLogo.jpg" className="navlogo"/>
</a>
<div className="collapse …Run Code Online (Sandbox Code Playgroud)