为什么封装？
迎合es6模块化开发思想
注册为全局组件，可以更好地复用，需要用到的地方，直接使用标签即可
静态结构 后面再进行更改
请求数据都存放在pinia里面
import { defineStore } from 'pinia'
import request from '@/utils/request'
import { BannerItem, IApiRes } from '@/types/data'
export default defineStore('home', {
persist: {
enabled: true
},
state() {
return {
bannerList: [] as BannerItem[]
}
},
actions: {
// 拿轮播图数据
async getBannerList() {
const res = await request.get>('/home/banner')
console.log('拿轮播图数据', res)
this.bannerList = res.data.result
}
}
}) 类型检测
// 所有的接口的通用类型 export interface IApiRes{ msg: string, result: T } // 轮播图数据中的项 export type BannerItem = { id: string; imgUrl: string; hrefUrl: string; type: string; }
