<template>
  <div>
    <ul>
      <li v-for="task in todolist" :key="task.id">{{ task.title }}</li>
    </ul>
  </div>
</template>
<script>
import { reactive, onMounted } from 'vue';
import axios from 'axios';

export default {
  setup() {
    const state = reactive({
      todolist: [],
    });

    const fetchTasks = async (pageSize, pageNum) => {
      try {
        const response = await axios.post('http://localhost:8888/task/findAllTask', {
          pageSize,
          pageNum,
        });
        state.todolist = response.data;
      } catch (error) {
        console.error(error);
      }
    };

    onMounted(() => {
      fetchTasks(10, 1);
    });

    return {
      ...state,
    };
  },
};
</script>
用vue3写一个代码实现的功能如下 用setup去发起一个axios的post请求接口httplocalhost8888taskfindAllTask携带参数为pageSize pageNum然后将请求的数据存入 data return todolist中

原文地址: https://www.cveoy.top/t/topic/1cf 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录