оптимизирован массив объекта для выбора администратора на отдыхе

Question

Как я могу сделать для с массивом?и не делать это, как у меня, это не оптимально, потому что это ручной метод, и я хочу оптимизировать его

const choices = [
  { id: '1', name: '1' },
  { id: '2', name: '2' },
  { id: '3', name: '3' },
  { id: '4', name: '4' },
  { id: '5', name: '5' },
  { id: '6', name: '6' },
  { id: '7', name: '7' },
  { id: '8', name: '8' },
  { id: '9', name: '9' },
  { id: '10', name: '10' },
  { id: '11', name: '11' },
  { id: '12', name: '12' },
  { id: '13', name: '13' },
  { id: '14', name: '14' },
  { id: '15', name: '15' },
  { id: '16', name: '16' },
  { id: '17', name: '17' },
  { id: '18', name: '18' },
  { id: '19', name: '19' },
  { id: '20', name: '20' },
  { id: '21', name: '21' },
  { id: '22', name: '22' },
  { id: '23', name: '23' },
  { id: '24', name: '24' },
  { id: '25', name: '25' },
  { id: '26', name: '26' },
  { id: '27', name: '29' },
  { id: '28', name: '28' }
]

<SelectInput label='Día de corte' source='cutOffDay'
        choices={choices} />

Я хочу сделать что-то подобное

const choices = []
const array = (choices) => {
  for(i = 0; i < 28; i++){
  choices = { id: i, name: i }
}

Answer 1

Вы должны использовать метод push, чтобы добавить объект для каждого индекса в вашем массиве

const getChoices = () => {
    const choices = []
  for(let i = 1; i <= 28; i++){
    choices.push({ id: i, name: i });
  }
  return choices;
}

<SelectInput label='Día de corte' source='cutOffDay'
        choices={getChoices()} />

Answer 2

Если вы хотите динамически добавлять элементы в выборку, есть несколько способов, но для вашего контекста это подойдет:

HTML:

<select label='Día de corte' id='cutOffDay'/>

Javascript:

const choices = [
  { id: '1', name: '1' },
  { id: '2', name: '2' },
  { id: '3', name: '3' },
  { id: '4', name: '4' },
  { id: '5', name: '5' },
  { id: '6', name: '6' },
  { id: '7', name: '7' },
  { id: '8', name: '8' },
  { id: '9', name: '9' },
  { id: '10', name: '10' },
  { id: '11', name: '11' },
  { id: '12', name: '12' },
  { id: '13', name: '13' },
  { id: '14', name: '14' },
  { id: '15', name: '15' },
  { id: '16', name: '16' },
  { id: '17', name: '17' },
  { id: '18', name: '18' },
  { id: '19', name: '19' },
  { id: '20', name: '20' },
  { id: '21', name: '21' },
  { id: '22', name: '22' },
  { id: '23', name: '23' },
  { id: '24', name: '24' },
  { id: '25', name: '25' },
  { id: '26', name: '26' },
  { id: '27', name: '29' },
  { id: '28', name: '28' }
]
const options = choices.map(c => { return `<option id=${c.id} value=${c.name}>${c.name}</option>`})
document.getElementById('cutOffDay').innerHTML = options.join();