Vue.jsのv-forディレクティブを説明する

Vue.js

Vue.js 

説明

Vue.jsにおけるディレクティブは、HTML要素に対して特定の動作を指示するために使用されます。

今回は、v-forディレクティブを説明します。

v-for:リストアイテムの反復処理に使用されます。

<template>
  <ul>
    <li v-for="item in items" :key="item.id">{{ item.name }}</li>
  </ul>
</template>

<script>
export default {
  data() {
    return {
      items: [
        { id: 1, name: 'Item 1' },
        { id: 2, name: 'Item 2' },
        { id: 3, name: 'Item 3' }
      ]
    }
  }
}
</script>

コメント

タイトルとURLをコピーしました