5.1.9 数组的定义和for语句的使用

       我们在uni-app中，实际制作作品中，要显示资讯列表、商品列表等都需要用到数组的循环显示，我们使用v-for语句来实现。

我们用 v-for 指令根据一组数组的选项列表进行渲染，语法形式如下：

v-for=”item in items”

items 是源数据数组并且 item 是数组元素迭代的别名

下面我们来看一个实例，我们定义一个数组shuiguo，里面存放的是几个水果的名称；然后我们在页面中使用v-for显示，完整代码如下：

<template>

     <view>

             <view v-for="sg in shuiguo">{{sg}}</view>

     </view>

</template>

<script>

     export default {

             data() {

                      return {

                               shuiguo:["香蕉","苹果","樱桃","枇杷"]

                      }

             },

             methods: {

             }

     }

</script>

<style>

  view{padding: 5px;}

</style>

运行效果如图：

【uniapp参考资料】

（1）uni-app跨平台开发 入门到实战 

https://ke.qq.com/course/package/26512

（2）uni-app 完整商城界面设计实战  

https://ke.qq.com/course/2381059

（3）基于vue的uniapp商城完整项目源代码 

https://ke.qq.com/course/3064977

（4）毕业设计网

http://www.pc-365.net

（5）小程序编程网

http://www.4317.org

（6）计算机编程网

http://www.05423.com