小编Rvf*_*fvl的帖子

我有一个组件，它使用 useEffect 中的 useDispatch 钩子将动作分派到减速器。我只希望它在第一次组件渲染时发生一次。然后当我尝试使用 useSelector 钩子从商店设置结果时，我得到了未定义。这是我的代码：

const SingleHotel = props => {
  //GETTING HOTEL ID FROM REACT-ROUTER-DOM PROPS
  const {
    match: {
      params: { id }
    }
  } = props

  //INITIALIZE USE DISPATCH REDUX HOOK.
  const dispatch = useDispatch()

  //ACCESSING HOTEL DETAILS STATE FROM THE REDUX STORE.
  const hotelDetails = useSelector(state => state.SingleHotel)

  //DISPATCHING HOTEL DETAILS TO THE REDUCER.
  useEffect(() => {
    dispatch(fetchSingleHotel(id))
  }, [])

  return <div>Single hotel page {console.log(hotelDetails)}</div>
}

我是 JSX 商店中的控制台日志记录状态，但我得到“未定义”。但是，当我在 Redux 开发工具中检查结果时，它显示正确。这是它的外观：

我有一张这样的桌子。名称列中的所有名称都是导航到下一页的链接。

|---------------------|------------------|
|         NAME        |         ID       |
|---------------------|------------------|
|        Name 1       |          1       |
|---------------------|------------------|
|        Name 2       |          2       |
|---------------------|------------------|
|        Name 3       |          3       |
|---------------------|------------------|

我试图获取链接，从中提取数据，然后返回到表。但是，表中有超过 4000 条记录，并且所有处理都非常缓慢（每条记录大约 1000 毫秒）

这是我的代码：

//Grabs all table rows.
const items = await page.$$(domObjects.itemPageLink);

  for (let i = 0; i < items.length; i++) {
    await page.goto(url);
    await page.waitForSelector(domObjects.itemPageLink);
    let items = await page.$$(domObjects.itemPageLink);

    const item = items[i];

    let id = await item.$eval("td:last-of-type", node => node.innerText.split(",").map(item => item.trim()));
    let link = …

我正在尝试基于React中的数学表达式对数组进行切片。但是，更漂亮的扩展名不允许我这样做，因为它删除了括号，使表达式不正确。

这是示例：

const paginateItems = items.slice(
      pageIndex * itemsPerPage,
      (pageIndex * itemsPerPage) * 2
    )

更漂亮的改变是

const paginateItems = items.slice(
      pageIndex * itemsPerPage,
      pageIndex * itemsPerPage * 2
    )

我该如何解决这个问题，以免强迫我的表达不正确？