Question

我编写了一个自定义钩子，它接受一个数组并将其分成 3 个不同的数组。我不明白要取回主要组件中的 3 个数组。

我的主要组件调用钩子：

 const [divide] = useDivideCat();
if(products) { 
  divide(products)
}

我的“useDivideCat”组件：


import { useSelector } from "react-redux"
import  _, { divide } from 'lodash'
import { useMemo, useState , useCallback, memo } from "react"


 const useDivideCat = () => { 
 
  const [main, setMain] = useState([]);
  const [first , setFirst] = useState(['']);
  const [ last, setLast] = useState(['']);
const mainDish=[]
const firstDish=[]
const deseret=[]

const divide = (products) =>  { 
for (var i=0;i<products.length;i++){
 const product = _.get(products, `${[i]}.catagory`);
  if (product=="mainDish") {

    mainDish.push(products[i]);
  }
  else if(product=="firstDish")
   {
    firstDish.push(products[i]);
  }
  else if(product==='deseret')
  {
    deseret.push(products[i]);
 }

  else {
    console.log(products[i].catagory)
  }
}

return mainDish , deseret , firstDish

}
return [divide]

}
export default useDivideCat

我不知道完成工作的不同方式提前致谢。

Answer 1

您需要在 divide 中返回一个数组或对象：

return { mainDish, deseret, firstDish };

你可以得到 3 个这样的新数组：

if(products) { 
  const { mainDish, deseret, firstDish } = divide(products)
}

Answer 2

您可以像这样从 divide 函数返回一个包含三个数组的对象

const divide = () => {
  ...

  return {mainDish , deseret , firstDish}
}

然后像这样在组件中使用它 {mainDish , deseret , firstDish} = divide(products)。

从反应自定义钩子返回 3 个数组

2 个答案: