Render 不是功能电子商务 React 组件

Question

我在我的 Cart.js 文件中使用了 class 组件，但它收到错误消息“render is not a function”。我也尝试将其更改为功能组件，但它也不起作用，请帮助我找到修复它的方法！非常感谢！

我的沙盒link：https://codesandbox.io/s/why-cant-i-fetch-data-from-a-passed-value-forked-buz0u?file=/src/App.js

Answer 1

Cart 组件有错误，因为您以错误的方式使用了 ProductContext 中的 Consumer。更改此代码将解决问题：

import React from "react";
const ProductContext = React.createContext();

export default class Cart extends React.Component {
  render() {
    return (
      <div>
        <ProductContext.Consumer>
          {(value) => {
            return <div>hello</div>
          }}
        </ProductContext.Consumer>
      </div>
    );
  }
}

Answer 2

请更改您的购物车组件

import React from "react";
const ProductContext = React.createContext();

export default class Cart extends React.Component {
  render() {
    return (
      <div>
        <ProductContext.Provider value={null}>
          hello
        </ProductContext.Provider>
      </div>
    );
  }
}

Render 不是功能电子商务 React 组件

Render is not a function e-commerce React component

reactjs

render