javascript - TypeError : Object(. ..) 不是一个函数 React js

Question

我想使用返回类型为 [list,listItems] 的 React.memo 创建一个通用函数。现在这样做会引发“TypeError:Object(...) is not a function”错误，我不知道为什么。我需要反馈和建议来解决此问题。我正在使用最新版本“react”:“^16.12.0”，“react-dom”:“^16.12。 0",

通用函数

   import React, { memo, useState, useEffect, useRef } from 'react';
import Card from '@material-ui/core/Card';

export const useGeneric = React.memo(({
    list = [],
    handleClick,
    deleteWorkflow,
}) => {

    const [items, setItems] = useState([]);
    const [listItems, setListItems] = useState([]);

    function setImgIcon(name) {
        switch (name.toUpperCase()) {

        }

    }

    function display() {
        console.log('newItemList', list);
        setItems(list);
        let listItems = list.map(val => (
            <li
                className='block-list-workflow'
                key={val.workflowId}
                data-id={val.workflowId}
                id='2'
            >
                <Card className='wf-Card'>

                </Card>
            </li>
        ));
        setListItems(listItems);
    }

    useEffect(() => {
        display();
        return () => { };
    }, []);

    return [items, listItems];
    });

主要组件

import React from 'react';

import { useGeneric } from './WorkflowList';
  .....
class Workflow extends React.Component {
  async componentWillMount() {
    await this.props.getAllWorkflow();
  }
  componentWillReceiveProps(nextProps) {
    if (
      nextProps.workflowLists !== undefined &&
      nextProps.workflowLists.workflows !== undefined
    ) {
      //   this.display(nextProps.workflowLists.workflows);
      console.log(
        'useGeneric :: ',
        useGeneric(
          nextProps.workflowLists.workflows,
          this.handleClick,
          this.deleteWorkflow
        )
      );
      const [items, listItems] = useGeneric(
        nextProps.workflowLists.workflows,
        this.handleClick,
        this.deleteWorkflow
      );
      this.setState({ items, listItems });
    }
  }

Answer 1

您可以尝试在主表单中使用备忘录，例如:

    const UseGeneric  = memo((list = [],handleClick,deleteWorkflow) => { 
                   //Your memo codes
    }

并使用通用 Cmp。喜欢

    <UseGeneric
        list= {//your list}
        handleClick = { //your click}
        deleteWorkflow = { // your flow}
    />