个人笔记 uniapp 创建子组件模板 和 自定义请求

Uni 搭建子页面
先创建子页面

在主页面引入组件

Components 里引入

在template 中引入

在分段器选项中添加 子页面模板

这里将v-show改成v-if 渲染问题

封装自己的请求
新建一个js 请求文件

先写一个导出函数

填写函数调用的返回对象

填写形参 用 … 来解构请求的参数

成功失败都会触发

添加一个加载显示

然后在 complete 中关闭加载动画

封装完毕后开始挂载到原型上

这里分两步
先导入

然后挂载

方便获取数据显示 在封装的js 成功响应 .data

在页面中的使用 直接this.requset

在子模块中请求数据

url 是后端给的接口地址
data 是向后端发送请求的参数 一般都回有接口文档 按文档填写
.then 就是请求成功响应
Result 是请求成功响应的参数

创建一个空数组用于接收参数 data 里的数据就 相当于你在页面前面定义了一个变量用来接收

调用时就可以直接 this. 在data里创建的变量 在标签里用的时候不用加this

将成功请求的数据取出 赋值给这个变量

在标签中取出数组对象的具体数据直接在标签中进行 v-for

当循环的数据中有唯一属性 也就是索引时 循环的对象中可以步用index
没有唯一属性的时候就添加一个index 进行循环

在src 前加两个冒号 相当于动态获取 因为是在循环标签中插入的图片标签 此时有几条路径就户渲染几张图片