uni-app控制台报错，页面不显示

Question

<template>
    <view class="kindList">
        
        <view class="tabBox">
            <view class="item" v-for="(item,index) in tabList" :key="index" @tap="toggleTab(index)">
                <view :class="current == index ? 'active' : ''">
                    {{item.name}}
                </view>
                <view class="iconBox" v-if="index == 1 || index == 2">
                    <uni-icons size="20rpx" type="top" :color="item.currentStatus == 'up' ? '#dd524d' : ''"></uni-icons>
                    <uni-icons size="20rpx" type="bottom" :color="item.currentStatus == 'down' ? '#dd524d' : ''">
                    </uni-icons>
                </view>
            </view>
        </view>
        
        <view class="cont">
            <ul style="list-style: none;">
                <li v-for="item in list" :key="item.id">
                    <image :src="item.pic"></image>
                    <view class="name">
                        {{item.name}}
                    </view>
                    <view class="num">
                        <view class="price">
                            ￥{{item.price}}元
                        </view>
                        <view class="intr">不凡</view>
                    </view>
                </li>
            </ul>
        </view>

    </view>
</template>

<script>
    import {
        findProductList
    } from "@/api/kind/kindList/kindList.js";
    export default {
        data() {
            return {
                start: 1,
                limit: 10,
                current: 0,
                list: [],
                tabList: [{
                        name: "新品",
                        currentStatus: "default"
                    },
                    {
                        name: "销量",
                        currentStatus: "default"
                    },
                    {
                        name: "价格",
                        currentStatus: "default"
                    },
                    {
                        name: "筛选",
                        currentStatus: "default"
                    },
                ]
            };
        },
        onLoad(options) {
            // console.log(options.id);
            this.init()
        },
        methods: {
            init() {
                findProductList(this.start, this.limit, {
                    "brandId": "",
                    "categoryId": options.id,
                    "isDesc": 0,
                    "keywords": "",
                    "sortBy": "",
                }).then(res => {
                    console.log("res", res);
                    this.list = res.data.rows;
                })
            },
            toggleTab(index) {
                this.current = index;
                this.tabList.forEach((ele, idx) => {
                    if (index != idx) {
                        ele.currentStatus = "default"
                    }
                })
                if (this.tabList[index].currentStatus == "default") {
                    this.tabList[index].currentStatus = "up"
                } else if (this.tabList[index].currentStatus == "up") {
                    this.tabList[index].currentStatus = "down"
                } else {
                    this.tabList[index].currentStatus = "up"
                }
            }
        },
    }
</script>

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

uni-app开发过程中遇到的问题，我在 onLoad 中给了值为 options ，然后我在 methods 中用 init() 方法将 findProductList 中的数据封装起来，并且将封装好的 init 给了 onLoad ，结果页面直接啥也不显示，而且控制台还报错options未找到，找不出问题所在，请大家帮忙找找。

Answer 1

onLoad参数中的options不能在methods中直接使用，可以做如下修改

onLoad(options) {
    // console.log(options.id);
    this.init(options)
},

init(options) {
    findProductList(this.start, this.limit, {
        "brandId": "",
        "categoryId": options.id,
        "isDesc": 0,
        "keywords": "",
        "sortBy": "",
    }).then(res => {
        console.log("res", res);
        this.list = res.data.rows;
    })
},