当前位置: 首页 > article >正文

Uniapp跨域请求

1.什么是跨域

是指当一个请求的URL的协议、域名或端口与当前页面的URL不同时,该请求被视为跨域请求。跨域是一种安全策略,用于限制一个域的网页如何与另一个域的资源进行交互。就比如我们进行前端向后端进行发送请求的时候,如果是开发前后端分离的项目时,跨域发送请求是经常需要进行实现的,比如使用uniapp向前端发送请求发送获取信息的时候就需要进行跨域。

2.如何实现

可以参uniapp官方文档进行开发和测试:uni.request(OBJECT) | uni-app官网 (dcloud.net.cn)。

这个就是我们进行跨域的方法,url就是你跨域的地址,也是你前端发送请求的地址,给到你的后端,并获取返回信息。data是你发送请求时所附带的参数。

比如你向后端发送一个查询信息,是查询你的分页需要查询第一页的信息并且发送过来的信息也的是你在参数里面写的长度,也就是一共会有多少条信息返回给你。

在页面上面设置一个按钮或者写到生命周期函数里面,来进行获取

设置好后在你的页面进行查看

可以看的已经成功获取到了数据,也可以进行分页处理,就是将发送过去的信息进行设置,不是直接打死值,让其变为活的值,也就是会变换的值。

先在页面上面设置两个按钮,一个是上一页另一个是下一页,分别为这两个按钮设置两个点击事件,名字自己去,最主要的是设置好自己需要提交的值也就是在自己的data的return下面设置好。

将之前设置的死值进行替换

最后在设置一个上一页和另一个下一页的方法,最主要的就是需要将pageNo也就是页码的值进行改变。

最后在页面上面进行测试

可以看的效果引进出来了,但是需要在进行一个判断,就是当前页面已经是第一页是不可以在上一页的,而最后一页同样不可以在下一页的

在上一部分已经是实现了的。

除了分页可以这样进行实现,删除也可以这样进行实现

设置一个id值,用来存放输入的id值

将接口替换为,后端定义的删除路径,之后在data里面设置你要删除的id,也就是后端接口接受的值。

点击删除后可以看到你的总记录数,由原来的数量减少了一个,这便说明了你的删除成功了。

添加和删除则是需要进行一个表格的设置,给使用是否有id来区分是删除操作还是添加操作。操作与上面类似,只不过需要进行添加的参数有所区别,原理是基本一致的。


http://www.kler.cn/a/466825.html

相关文章:

  • JavaScript系列(8)-- Array高级操作
  • 【2025年最新】OpenWrt 更换国内源的指南(图形界面版)
  • uni-app:实现普通选择器,时间选择器,日期选择器,多列选择器
  • Linux下编译安装PETSc
  • flutter在windows平台中运行报错
  • Synthesia技术浅析(二):虚拟人物视频生成
  • ​​​​​​​CDP集群安全指南系列文章导读
  • 无人机解码物流配送技术详解
  • ReactiveStreams、Reactor、SpringWebFlux
  • 【深度学习遥感应用中的“信息”】空间信息、语义信息、纹理信息、边缘信息、表层信息、深层信息...
  • 探索 AIGC 的基础知识:人工智能生成内容的全景视图
  • 深入解析与实践:MySQL
  • React实现长列表
  • python的reload
  • Java重要面试名词整理(十四):elasticsearch
  • halcon中的阈值分割
  • 计算机视觉之三维重建-摄像机标定
  • vue中使用exceljs组件库导入导出json到excel
  • Vue3苦逼的学习之路
  • 【U8+】用友U8软件中,出入库流水输出excel的时候提示报表输出引擎错误。
  • 探索AI在地质科研绘图中的应用:ChatGPT与Midjourney绘图流程与效果对比
  • Postman[1] 入门——安装及启动
  • elementui table 表格 分页多选,保持选中状态
  • AEM电解水制氢技术在综合能源站的场景适应性
  • HTML——70. 多行文本输入框
  • 探索Flutter 3.0:跨平台开发的未来