TypeError: Object(..) 不是函数 React js

Question

我想使用返回类型为 [list,listItems] 的React.memo创建一个泛型函数。现在这样做会抛出一个"TypeError：Object(...不是函数"错误，我不知道为什么。我需要反馈和建议来解决此问题。我正在使用最新版本"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}
/>