fjjgpt/src/views/Problem/listquestions.vue

<template>
    <div style="height: 100%;">
        <van-pull-refresh class="inspect-object-question-wrapper" v-model="loading" @refresh="getData()">
            <!-- 使用 v-for 指令遍历 list 数组 -->
            <card01 v-for="item in list" :key="item.id" :title="item.pblmNm + ''" icon="notes"
                    :description="renderData(item, item.pblmDesc)"
                    @click="jumpPage(`/problem/${item.id}`)" />
        </van-pull-refresh>
    </div>
</template>
<script setup>

import { renderData } from "@/utils/template";
import { jumpPage } from "@/utils/page";
import { getTacQuestionList } from "@/api/questions";
import { onMounted, ref } from "vue";
import card01 from '@/components/card01.vue';

// 使用 ref 定义响应式变量 list 和 loading
const list = ref([]);
const loading = ref(false);

// 定义 objectConfig 变量
const objectConfig = ref({
    description: '这里是默认描述信息' // 你可以根据实际情况修改默认描述内容
});

// 定义 getData 函数，用于获取数据
function getData() {
    // 设置 loading 为 true，表示正在加载数据
    loading.value = true;
    // 调用 getTacQuestionList 接口获取数据
    getTacQuestionList().then(res => {
        // 将接口返回的数据赋值给 list
        list.value = res.data.list;
        console.log(list.value);
        // 设置 loading 为 false，表示数据加载完成
        loading.value = false;
    })
}

// 在组件挂载后调用 getData 函数获取数据
onMounted(() => {
    getData();
})
</script>

<style lang="scss" scoped>
.inspect-object-wrapper {
  width: 100%;
  height: 100%;
  overflow: auto;
}
</style>