小编Tol*_*ima的帖子

React 上下文消费者呈现多个子错误

我只是尝试使用 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)

consumer reactjs

8
推荐指数
1
解决办法
2万
查看次数

标签 统计

consumer ×1

reactjs ×1