时间戳

首页 > 解决方案 > 如何让 SPA 加载最高值选项卡​​？

reactjs - 如何让 SPA 加载最高值选项卡​​？

问题描述

我有一个带有 Typescript 的 React SPA。我正在使用材质 UI。我创建了一个循环来制作一个包含当前月份和之前所有月份的选项卡菜单。它工作正常，除了我希望页面在上个月加载时处于活动状态。

我尝试过一些谷歌搜索，但似乎没有人遇到与我在高价值标签上遇到的问题相同的问题。

这是我的代码的render部分，感觉剩下的代码是没有必要的问题。

render() {
  const month = new Date().getMonth();

  for (var i = month; i >= 0; i--) {
   rows.push(i);
  }

  const months = ['January','February','March','April','May','June','July','August','September','October','November','December'];

  return (
    <TabHeader>
      {rows.map((item, index) => {
        return (
          <Tab
            key={index}
            value={item}
            label={months[new Date(0, 0).getMonth()+item]}
            component={Link}
            to={`/month/${item+1}`}
          />
        )
      })}
    </TabHeader>
  )
}

我希望在您进入页面时将活动选项卡设为最高值选项卡​​，在当前情况下，这将是值为 8 的 9 月。

标签： reactjstypescriptmaterial-ui

解决方案

正如 Rikin 在评论中指出的那样，将值传递给 TabHeader 是一个问题，这是我制作的包含 Tabs 的通用组件。

推荐阅读