映射字典数组以选择下拉菜单?

时间:2019-03-09 02:00:52

标签: javascript reactjs

我正在尝试将词典数组映射到选择下拉列表,但是我目前的方法只是产生正确数量的选择选项而没有值。

This is what my array looks like:
dateArray = [
      {year:'2016', month: "01"},
      {year:'2017', month: "01"},
      {year:'2018', month: "02"},
      {year:'2018', month: "02"}
    ];

这是我尝试将数组映射到选择下拉列表的方式:

            <select className='form-control'>
              {this.state.dateArray.map((year) => <option key={year.value} value={year.value}>{year.display}</option>)}
            </select>
            <select className='form-control'>
              {this.state.dateArray.map((month) => <option key={month.value} value={month.value}>{month.display}</option>)}
            </select>

如何映射我的词典数组以选择下拉菜单?

2 个答案:

答案 0 :(得分:1)

也许这样可以工作:

if len(l)>n:
    raise Exception('Please give only {} inputs'.format(n))

答案 1 :(得分:0)

此代码使用.foreach()循环遍历数组,并使用.querySelectorAll()选择元素。然后,它使用.innerHTML将选项附加到选择项上。

let dateArray = [{
    year: '2016',
    month: "01"
  },
  {
    year: '2017',
    month: "01"
  },
  {
    year: '2018',
    month: "02"
  },
  {
    year: '2018',
    month: "02"
  }
];
let select = document.querySelectorAll(".form-control")[0];

dateArray.forEach(e => {
  select.innerHTML += `<option key="${e.year}" value="${e.year}">${e.year}</option>`;
});
<select class='form-control'>

</select>