感谢好友斌哥的指导，成功解决了接口调试的难题，迈了一大步
之前一直因为公司接口文档apizza不能够测试接口而烦恼，然后就是自己也没有使用postman。晚上聊天突然聊到了这个，就立刻试了，发现成功了,激动不已！
分为三步： 第一步：填写正确的网址, 选择get或者post请求 第二步：填写表头 第三部：填写请求或者body
就是这么简单，上面是post接口的，get的更加的简单
之后就是看到了我项目中的问题，表单的提交
接口好了怎么把数据传过去呢？ 有一个之前写好的案例可以用：
let params = {
circle_id: circle_id,
content,
category_id,
is_anonymous,
file_json: JSON.stringify(imgList),
type: 1,
main_type: 1
}
api.releasePost(params).then(res => {
if (res.code == 0) {
uni.showToast({
icon: "success",
title: "发帖成功",
mask: true
})
setTimeout(() => {
uni.navigateBack()
}, 1800)
}
})
}
//帖子发布实际上是一个post请求，然后具体信息如下：
// 帖子发布
releasePost: function(data) {
return request({
url: '/api/top/releasePost',
method: 'POST',
data: data,
})
},
//表单数据的收集如下方代码所示（uniapp语法，和vue类似的）
<script>
// import CusTabbar from '../../components/cus-tabbar.vue';
import {
onMounted,
reactive,
ref,
toRefs
} from "vue"
import {
getSystemInfo,
debounce
} from '../../utils/mixin.js'
import {
onShow,
onLoad
} from '@dcloudio/uni-app'
import api from "../../utils/api.js"
import {
apiUrl
} from "../../utils/request.js"
export default {
components: {
},
props: {},
methods: {
},
setup(props) {
const state = reactive({
title: 'Vue3 UniApp',
systemInfo: {},
category_id: null,
detail: {},
circle_name: '选择圈子',
content: '',
is_anonymous: 1,
list: [],
typeList: [],
circle_id: null,
imgList: [],
keyword: '',
mainHeight:0,
circleList: [],
status: 'loading',
reload: true,
pageSize: 10,
current_page: 1, //当前页码
last_page: 1, //总页码
contentText: {
contentdown: '下拉加载更多',
contentrefresh: '疯狂加载中...',
contentnomore: ''
}
})
onLoad((props) => {
fetchData()
})
const selectDialog = ref()
onMounted(() => {
const sysInfo = getSystemInfo()
state.systemInfo = sysInfo
state.mainHeight = sysInfo.windowHeight / 1.8
})
const fetchData = () => {
api.getCommonData({}).then(res => {
if (res.code === 0) {
console.log(res.data, 233)
state.typeList = res.data.post_category[0].children
}
})
circleData()
}
const circleData = (type) => {
const {
pageSize,
current_page, //当前页码
last_page, //总页码
} = state
let params = { keyword: state.keyword }
if(type == 'lower'){
params.pageSize = pageSize
params.page = current_page
}
api.getCircleList(params).then(res => {
if (res.code === 0) {
if (type === 'lower') {
state.circleList = state.circleList.concat(res.data.list);
} else {
state.circleList = res.data.list;
}
state.current_page = res.data.pagination.current; //当前页码
let lastPage = Math.ceil(res.data.pagination.total / res.data.pagination.pageSize);
state.last_page = lastPage; //总页码
state.pageSize = res.data.pagination.pageSize
console.log(state.current_page, lastPage, '页码')
// 判断是否还有数据
if (res.data.pagination.current === lastPage || res.data.pagination
.total ===
0) {
state.status = 'noMore';
} else {
state.status = 'more';
}
}
})
}
const handleUpper = () => {
loadData('upper');
}
const handleLower = () => {
loadData('lower');
}
const hanldChangeCircle = (id, name) => {
state.circle_id = id
console.log(id, name)
state.circle_name = name
selectDialog.value.close()
}
const open = () => {
selectDialog.value.open('bottom')
}
const close = () => {
selectDialog.value.close()
}
const loadData = async (type) => {
state.status = 'loading';
// 判断上拉还是下拉
if (type === 'upper') {
state.current_page = 1;
} else if (type === 'lower') {
if (state.current_page >= state.last_page) {
state.status = 'noMore';
return false;
} else {
state.current_page += 1;
}
}
circleData(type)
}
const switchChange = (e) => {
state.is_anonymous = e.detail.value == true ? 2 : 1
console.log(state.is_anonymous)
}
const hanldChangeType = (id) => {
state.category_id = id;
}
const deleteCurrent = (index) => {
var list = JSON.parse(JSON.stringify(state.imgList));
list.splice(index, 1);
state.imgList = list;
}
const searchCircle = () => {
console.log('sousuo')
circleData()
}
const handleChooseMyImage = () => {
uni.chooseImage({
count: 9,
sizeType: ['compressed'],
success: function (res) {
console.log(res.tempFilePaths);
if (res.tempFilePaths.length == 0) {
return;
}
var imgArrNow = state.imgList;
if (imgArrNow.length > 9) {
uni.showToast({
title: '图片最多上传9张',
icon: 'none',
})
return
}
if (res.tempFilePaths.length > 0) {
let isUploadStatus = [...new Array(res.tempFilePaths.length).keys()];
for (let i = 0; i < res.tempFilePaths.length; i++) {
uploadMyFn(res.tempFilePaths[i])
}
}
},
complete: (res) => { },
})
}
const uploadMyFn = (pathUrl) => {
var that = this;
console.log(pathUrl);
uni.showLoading();
uni.uploadFile({
url: apiUrl() + '/api/admin/file/uploadNoToken',
filePath: pathUrl,
name: 'file',
success(res) {
if (res.statusCode == 200) {
const data = JSON.parse(res.data)
if (data.code == 0) {
console.log('file', data)
let imgList = JSON.parse(JSON.stringify(state.imgList))
imgList.push(data.data.file_url)
state.imgList = imgList
} else {
uni.showToast({
icon: 'none',
title: data.message
})
}
} else {
uni.showToast({
icon: 'none',
title: 'Serve ' + res.statusCode
})
}
},
fail(err) {
console.log('upload err', err)
},
complete() {
uni.hideLoading()
}
})
}
const handlePost = () => {
const {
content,
category_id,
is_anonymous,
circle_id,
imgList
} = state
console.log(state.content, 122)
if (!circle_id || state == undefined) {
uni.showToast({
icon: "none",
title: "请选择圈子"
})
return;
}
if (content == '' || state == undefined) {
uni.showToast({
icon: "none",
title: "请输入帖子内容"
})
return;
}
if (!category_id || state == undefined) {
uni.showToast({
icon: "none",
title: "请选择分区"
})
return;
}
let params = {
circle_id: circle_id,
content,
category_id,
is_anonymous,
file_json: JSON.stringify(imgList),
type: 1,
main_type: 1
}
api.releasePost(params).then(res => {
if (res.code == 0) {
uni.showToast({
icon: "success",
title: "发帖成功",
mask: true
})
setTimeout(() => {
uni.navigateBack()
}, 1800)
}
})
}
return {
...toRefs(state),
handlePost,
hanldChangeType,
switchChange,
deleteCurrent,
hanldChangeCircle,
handleUpper,
searchCircle,
handleLower,
open,
close,
selectDialog,
handleChooseMyImage
}
}
}
</script>
上面就是典型的拿到值就行传递，然后就是先建立一个对象，把数据放在对象里面，然后就是把这个对象作为post的主体，传送过去。
彩蛋：发现公司的文档也可以进行进行测试的，只是不是在测试模式下面，而是在开发者模式下面
