uniapp学习循环判断及数据和对象

 <template>

<view>

<view>标题：{{title}}</view>

<view>num：{{num}}</view>

<view>arr：{{arr}}</view>

<view>arr0:{{arr[0]}}</view>

<view>arr1:{{arr[1]}}</view>

<view>arr3:{{arr[3]}}</view>

<view>obj:{{obj}}</view>

<view>obj.phoe:{{obj.phone}}</view>

------v-if------

<h1 v-if="state">vue学习入门</h1>

<h1 v-else>uniapp学习入门</h1>

------v-show------

<view v-show="state">v-show</view>

<view v-show="!state">not-v-show</view>

------v-for arr------

<view v-for="(item,index) in arr" class="out">

<view class="row">{{index+"."+item}}</view>

</view>

------v-for arrobj------

<view class="goods" v-for="item in goods" :key="item.id">

<view>商号名称：{{item.title}} - 价格：￥{{item.price}}</view>

</view>

------for object-----

<view v-for="(value,name,index) in obj">

{{index}} - {{name}} - {{value}}

</view>

</view>

</template>

<script>

export default {

data() {

return {

title:"vue学习入门",

num:2304,

arr:["aaa","bbb","uni",1,2,3],

obj:{

      username: "zhangsan",

      userId: 1,

      avator: "http://www.xxx.com/upload/xxx.png",

      token: "e10adc3949ba59abbe56e057f20f883e"

},

state:true,

day:3,

goods:[

{

id:1,

title:"商品1",

price:15.5

},{

id:2,

title:"商品2",

price:20.5

}

]

};

}

}

</script>

<style lang="scss">

.out{

.row{

font-size: 50rpx;

}

}

</style>