Javascript 在React.js中映射多个数组

我正努力做到这一点：

在尝试时，我创建了一个JavaScript对象（类似JSON的对象）来访问它。代码如下：

const weekArray=[
{
周月：'二月'，
weekDayofWeek:['Thur'，'Thur'，'Thur'，'Thur'，'Thur']，
工作日：['04'，'11'，'18'，'25']，
weekStatus:“可用+”，
类名：“二月”
},
{
周月：“三月”，
weekDayofWeek:['Thur'，'Thur'，'Thur'，'Thur'，'Thur']，
工作日：['04'，'11'，'18'，'25']，
weekStatus:“可用+”，
类名：“三月”
},
{
周月：“四月”，
weekDayofWeek:['Thur'，'Thur'，'Thur'，'Thur'，'Thur']，
工作日：['01'，'08'，'15'，'22'，'29']，
weekStatus:“可用+”，
类名：“四月”
},
{
周月：“五月”，
weekDayofWeek:['Thur'，'Thur'，'Thur'，'Thur'，'Thur']，
工作日：['06'，'13'，'20'，'27']，
weekStatus:“可用+”，
类名：“May”
}
];
const WeekShow=（）=>{
返回(
{weekArray.map（（WeekValue）=>(
{WeekValue.weekMonth}
{WeekValue.weekDayofWeek}
{WeekValue.weekDays}
{weekValue.weekStatus}
))}
);
}
ReactDOM.render(
,
根
);
span{
右边距：10px；
}
您应该再次循环
。weekDayofWeek
：）


const weekArray=[
{
周月：'二月'，
weekDayofWeek:['Thur'，'Thur'，'Thur'，'Thur'，'Thur']，
工作日：['04'，'11'，'18'，'25']，
weekStatus:“可用+”，
类名：“二月”
},
{
周月：“三月”，
weekDayofWeek:['Thur'，'Thur'，'Thur'，'Thur'，'Thur']，
工作日：['04'，'11'，'18'，'25']，
weekStatus:“可用+”，
类名：“三月”
},
{
周月：“四月”，
weekDayofWeek:['Thur'，'Thur'，'Thur'，'Thur'，'Thur']，
工作日：['01'，'08'，'15'，'22'，'29']，
weekStatus:“可用+”，
类名：“四月”
},
{
周月：“五月”，
weekDayofWeek:['Thur'，'Thur'，'Thur'，'Thur'，'Thur']，
工作日：['06'，'13'，'20'，'27']，
weekStatus:“可用+”，
类名：“May”
}
];
const renderWeekDayofWeek=（{weekDayofWeek，weekDays，weekStatus}）=>{
返回weekDayofWeek.map（（r，index）=>(
{r}
{工作日[索引]}
{weekStatus}
));
}
const WeekShow=（）=>{
返回(
{weekArray.map（（WeekValue）=>(
{WeekValue.weekMonth}
{renderWeekDayofWeek（WeekValue）}
))}
);
}
ReactDOM.render(
,
根
);
我建议更改
weekArray
的形状，这样更容易渲染，每周可以处理不同的状态

在第一维度，它将有几个月的时间（就像现在一样）。我建议每个月都有
week
数组，其中包含每周的数据


const monthsArray=[
{
月份：'二月'，
类名：“二月”，
周数：[
{
日期：'04'，
星期四，
状态：“可用+”，
},
{
日:"11",，
星期四，
状态：“可用+”，
},
{
日:"18",，
星期四，
状态：“可用+”，
},
{
第25天，
星期四，
状态：“可用+”，
},
]
},
{
月份：'三月'，
类名：“三月”，
周数：[
{
日期：'04'，
星期四，
状态：“可用+”，
},
{
日:"11",，
星期四，
状态：“可用+”，
},
{
日:"18",，
星期四，
状态：“可用+”，
},
{
第25天，
星期四，
状态：“可用+”，
},
]
},
{
月份：'四月'，
类名：'April'，
周数：[
{
日期：'01'，
星期四，
状态：“可用+”，
},
{
日期：'08'，
星期四，
状态：“不可用”，
},
{
日期：'15'，
星期四，
状态：“可用+”，
},
{
日:"22",，
星期四，
状态：“可用+”，
},
{
第28天，
星期四，
状态：“可用+”，
},
]
},
{
月份：'五月'，
类名：“May”，
周数：[
{
日期：'06'，
星期四，
状态：“可用+”，
},
{
日期：'13'，
星期四，
状态：“可用+”，
},
{
日:"20",，
星期四，
状态：“不可用”，
},
{
第27天，
星期四，
状态：“可用+”，
},
]
},
];
const WeekShow=（）=>{
返回(
{monthsArray.map（（monthValues）=>(
{monthValues.month}
{MonthValue.weeks.map（（WeekValue）=>(
const renderWeekDayofWeek = ({weekDayofWeek, weekDays, weekStatus}) => {
  return weekDayofWeek.map((r, index) => (
    <div className="card" key={index}>
    <h5>{r}</h5>
    <h5>{weekDays[index]}</h5>
    <h5>{weekStatus}</h5>
  </div>
));
}

 {weekArray.map((weekValues) => (
      <div key={weekValues.className}>
        <span>{weekValues.weekMonth}</span>
        {renderWeekDayofWeek(weekValues)}
      </div>
    ))}