uni-app 数据循环

  • 通过v-for指定需要循环的数组
  • item/index分别为 循环项 / 循环索引
  • :key 指定唯一的属性,用来提高循环效率
<view
    v-for="(item, index) in list"
    :key = "item.id"
>
    {
   
   {item.text}}
</view>

Demo

<template>
    <view class="content">
        <view
            v-for="(item,index) in list" # 固定格式写法,index默认可省去
            :key = "item.id" #冒号必须有,key绑定的值必须唯一
        >
            {
   
   {item.id}} --- {
   
   {item.text}} ---- {
   
   {index}}
        </view>
    </view>
</template>

<script>
    export default {
        // 1. define data
        data() {
            return {
                list: [
                    {
                        id: 0,
                        text: "test00"
                    },
                    {
                        id: 1,
                        text: "test01"
                    },
                    {
                        id: 2,
                        text: "test02"
                    }
                ]
            }
        }
    }
</script>

猜你喜欢

转载自blog.csdn.net/A_bad_horse/article/details/113652097