Как в vue.js, в компоненте tsx вывести элементы в цикле?

Question

[koliane]

Используются компоненты tsx, т.е. для рендеринга компонента используется ф-ия

render() {
    return (
      <div>
          <div v-for={weekDay in this.arWeekDays} >
              <div>{weekDay}</div>
          </div>
      </div>
    )
  }

Но этот код выдает ошибку "index is not defined".
Подскажите, как можно реализовать вывод элементов в цикле в tsx?

В примере нужно в цикле вывести дни недели. Если делать не через tsx, то аналог выглядел бы примерно так:

<div>
  <div v-for="weekDay in arWeekDays" >
    <div>{{weekDay}}</div>
  </div>
</div>

Answer 1

[0xD34F]

v-for={weekDay in this.arWeekDays}

выдает ошибку "index is not defined"

А может, всё-таки "weekDay is not defined"? Или вы о чём-то умалчиваете?

Про v-for забудьте:

<div>
  {this.arWeekDays.map(n => <div>{n}</div>)}
</div>

Comments

[koliane]

Спасибо!

[#FFFFFF]

0xD34F почему map лучше чем v-for? вроде с v-for почитабельнее выглядит, особенно если там не просто див, а много разметки.

[0xD34F]

#FFFFFF, "почитабельнее выглядит" ЧТО? Это render-функция, тут никаких v-for нет.