1.封装获取猜你喜欢数据API
2.组件挂载完毕调用API
这个是接口文档:
下面:
组件内部获取数据,我们其他的都是在index.vue里面获取的:
我们来看一下数据,可以看到数据很多(items商品信息):
定义数据类型:
这里的分页我们其他地方也会用到,因此我们把他定义成一个通用的类型,知识列表数据有变化
商品类型,也就是Items类型
通用分页结果类型如下,新建 `src/types/global.d.ts` 文件: ```ts /** 通用分页结果类型 */ export type PageResult<T> = { /** 列表数据 */ items: T[] /** 总条数 */ counts: number /** 当前页数 */ page: number /** 总页数 */ pages: number /** 每页条数 */ pageSize: number } ``` 猜你喜欢-商品类型如下,存放到 `src/types/home.d.ts` 文件: ```typescript /** 猜你喜欢-商品类型 */ export type GuessItem = { /** 商品描述 */ desc: string /** 商品折扣 */ discount: number /** id */ id: string /** 商品名称 */ name: string /** 商品已下单数量 */ orderNum: number /** 商品图片 */ picture: string /** 商品价格 */ price: number }
到这里数据就定义完成了下面就可以渲染了
就按照这样改:
看一下效果:
标签:string,ts,渲染,商品,number,列表,类型定义,类型,数据 From: https://www.cnblogs.com/aixin52129211/p/17984454