映射 JSON 字段答案

【问题标题】：Mapping JSON fields映射 JSON 字段
【发布时间】：2020-04-17 12:05:23
【问题描述】：

我有一个使用 PHP json_encode 函数创建的 JSON：

$json = [{"title":"test1","date":"2019, 12, 27"},{"title":"test2","date":"2019, 11, 19"}];

我想将这些字段映射到日历数据源字段中：https://year-calendar.github.io/rc-year-calendar/examples如何正确执行此操作？

我需要什么：

<script type="text/javascript">
const calendar = new Calendar('#calendar', {
  dataSource: [
            {
                startDate: new Date(2019, 12, 27),
                name: 'test1'
            },
            {
                startDate: new Date(2019, 11, 19),
                name: 'test2'
            }, 
        ],
});
</script>

我尝试了什么：

$json = [{"title":"test1","date":"2019, 12, 27"},{"title":"test2","date":"2019, 11, 19"}];

<script type="text/javascript">

var json = <?php echo $json; ?>;
const calendar = new Calendar('#calendar', {
  dataSource: [
          return json.map(r => ({
            startDate: new Date(r.date),
            name: r.title,
          }));
        ],
});
</script>

【问题讨论】：

标签： javascript json mapping

【解决方案1】：

你可以这样做：

const calendarArray = [{"title":"test1","date":"2019, 12, 27"},{"title":"test2","date":"2019, 11, 19"}];


const dataSource = calendarArray.map((element) => {
  return {
    startDate: new Date(element.date),
    name: element.title
  }
});

const calendar = new Calendar("#calendar", {dataSource: dataSource})

<script src="https://unpkg.com/js-year-calendar@latest/dist/js-year-calendar.min.js"></script>
<div id="calendar"></div>

【讨论】：

【解决方案2】：

您正在尝试在数组中使用 map。 .map() 返回基于原始数组创建一个新的值数组。您将数据源定义为数组，并试图像函数一样使用它，这就是它不起作用的原因

试试这个

    const calendarData = json.map(r => ({
            startDate: new Date(r.date),
            name: r.title,
          }));
    const calendar = new Calendar('#calendar', {
    dataSource: calendarData
});

或者排队

const calendar = new Calendar('#calendar', {
  dataSource: json.map(r => ({
            startDate: new Date(r.date),
            name: r.title,
          }));,
        });

【讨论】：