v-for方法遍歷數組，從後端獲取數據，前端取值調用uni app

v-for方法遍歷數組，從後端獲取數據，前端取值調用

template寫法

	<!-- row數組中的每一列 -->
			<!-- cateId爲後端詳情頁時要取得值id -->
<template>
<navigator class="category" v-for="(row, index) in categoryList" :key="index" :url="'../info/home-category-info?Id='+row.cateId">
				<view class="img">
					<image :src="row.catePic" ></image>
				</view>
				<view class="text">{{ row.cateName }}</view>
			</navigator>
		</view>
</template>

script中寫法

<script>
//把this的值重定義，不然會丟失
	var _self;
	export default {
		data() {
			return {
                 // 定義一下分類菜單
				categoryList: [],
            }
        },
           //頁面加載時調用
           // e用來給他的跳轉頁面傳數據，就是判斷破、id用
		onLoad: function(e) {
            //把this的值重定義
           //頁面加載這方法gethome            
			_self = this;
			this.gethome();
        }，
        methods:{
            //在methods裏定義一個方法gethome
			gethome: function() {		
				// localStorage.getItem('data')
				var Token=localStorage.getItem('data')
				// console.info(localStorage.getItem('data'))
				uni.request({
					url: this.baseURL + '/lingyoutuo_war/index/index.do',
					dataType: 'json',
                    //POST請求要加的header請求頭
					method: 'POST',
					header: {
						// 'accessToken':'data',
						'accessToken':Token,
						'content-type': 'application/x-www-form-urlencoded',
					},
                     //把後端的數組遍歷到前端數組裏
					success(res) {
						_self.categoryList = res.data.data.serviceList;

					}
				});
			}
          

        }
}

跳轉頁面

正常取值了

            <view class="can1">
                <text class="txt">
                    <text class="txt1">{{items.cateName}}</text>
                </text>
            </view>
            <text class="txt-nav">{{items.cateDesc}}</text>
        </view>
 

	var _self;
	export default {
		data() {
			return {
                //定義一個數組用來取後端傳的值
                items: [],
                定義一個id給後端傳值掉接口
				Id: Number,
                    }
                }，
               //e就是上個頁面的id標識
 		    onLoad: function(e) {
			
			_self=this;
            //判斷用戶登錄的狀態
			var Token = localStorage.getItem('data')
			uni.request({
				url: this.baseURL + '/lingyoutuo_war/service/getServiceDtl.do',
				method: 'POST',
				data: {
                     把e.Id給後端的cateId進行校驗
					cateId:e.Id,
				},
				header: {
                    //登錄狀態給header中的accessToken,就可以讀取登錄頁面取得用戶值來判斷用戶是否登錄
					'accessToken': Token,
					'content-type': 'application/x-www-form-urlencoded',
				},
				success(res) {
					_self.items = res.data.data;
           	
    }

如果接口數據裏有數組形式