uni.request(OBJECT)
发起网络请求
具体参数可查看官方文档uni-app
data:请求的参数;
header:设置请求的 header,header 中不能设置 Referer;
method:请求方法;
timeout:超时时间,单位 ms(默认60000);
dataType:如果设为 json,会对返回的数据进行一次 JSON.parse,非 json 不会进行 JSON.parse;
....
免费测试api接口:https://jsonplaceholder.typicode.com/
第一种
<template></template><script setup>function request(){uni.request({url:"https://jsonplaceholder.typicode.com/posts", //开发者服务器接口地址method:"post", //请求方法success:res=>{ //收到开发者服务器成功返回的回调函数console.log(res);}})}request();</script><style lang="scss" scoped></style>
第二种
<template></template><script setup>function request(){uni.request({url:"https://jsonplaceholder.typicode.com/posts"}).then(res=>{arrs.value=res.data})}request();</script><style lang="scss" scoped></style>
第三种
异步同步化
<template></template><script setup>async function request(){let res = await uni.request({url:"https://jsonplaceholder.typicode.com/posts"})arrs.value=res.data}request();</script><style lang="scss" scoped></style>
示例:
<template><view class="out" v-for="item in arrs"><view class="title">{{item.title}}</view><view class="content">{{item.body}}</view></view>
</template><script setup>let arrs = ref();function request(){uni.request({url:"https://jsonplaceholder.typicode.com/posts"}).then(res=>{arrs.value=res.data})}request();
</script><style lang="scss" scoped>.out{padding: 30rpx;.title{font-size: 40rpx;}.content{margin: 15rpx 0;border-bottom: 1px solid #696969;color: #696969;}}
</style>
( 注:ref 没有使用 import { ref } from 'vue'; 导入是因为下载了插件(具体可查看博客),没有下载的需常规导入)
运行结果: