uni-app请求数据报错，页面无法渲染

<template>
    <view class="info">
        
        <swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000">
            <swiper-item v-for="item in productDetail" :key="item.id">
                <image :src="item.pic">image>
                <view class="swiper-item">view>
            swiper-item>
        swiper>
    view>
template>

<script>
    import {
        productDetail
    } from "@/api/kind/kindList/info/info.js"
    export default {
        data() {
            return {
                productDetail: {},
            };
        },
        onLoad(options) {
            productDetail(options.id).then(res => {
                console.log("商品详情", res);
                this.productDetail = res.data.product;
            })
        }
    }
script>

<style lang="scss" scoped>
    @import 'info.scss'
style>

请问一下上面这个报错怎么解决，无法读取id，但是我数据请求成功了，就是这个id的地方报错，导致数据不能在页面显示出来

在这里打印options，应该是个undefined
加一个console.log(options)

首先定位问题：

1. 你onload 时拿到的 options 是从你上一个页面传入进来的，你要检查你上一个页面是怎么传的就直接字符串拼接还是传递的 { id:1 }，这种类型
2. 如果是字符串拼接，你要打印一下options，不是字符串拼接要用decodeURIComponent 一下

id未定义 也就是说 roductDetail 里 没有id属性 你打印看看

• 请看👉 ：uni-app 中的路由与页面跳转

返回的res.data.product应该是json对象而不是数组，不能用v-for遍历