vue3中多个reactive对象合并后在发出ajax请求

先用toRefs放出来，利用了...扩展格式，然后再利用reactive进行包装。这样可以把多个reactive对象进行重新包装后发送请。

    let reqObject = reactive({...toRefs(page), ...toRefs(queryParams)});

在vue3页面中，一般有个page对象，用于存放页面是请求的具体哪个页。

同时还有个一个参数请求对象。这个也一般都是reactive对象。

页码参数对象

let page = reactive({
    pageNum:1,
    pageSize:10,
})

请求参数对象

let queryParams = reactive({
    ownerBase: '',
    operationType: '',
    vin: '',
    vehicleBrand: '',
    vehicleAliasName: '',
    incomeSettle: '',
    orderId: '',
    handoverNo: '',
    orderDate: [],
    agency: '',
    tdpStartLocation: '',
    tdpEndLocation: '',
    operationEndTime: [],
    tdpCode: '',
})

elementplus中表格数据的ref对象

let tableData = ref([]);

elementplus中表格数据的页面中除了页面对象还有个页码total值。

let pageTotal = ref(0);

可以直接构建请求query这个是放到了api下， 可以直接ajax.post请求。

    let reqObject = reactive({...toRefs(page), ...toRefs(queryParams)});
    query(reqObject).then((res)=>{
        console.log(res.data);
        loading.value = false;
        //tableData.value = res.data;
        tableData.value = res.data.content;
        pageTotal.value = res.data.totalElements;
        page.pageNum = res.data.number+1;
        page.pageSize = res.data.size;
    }).catch((err,res)=>{

    });

    axiosInstance.post('/query/querylist', 
        data,
        {
            headers: {
                "Content-Type": "multipart/form-data"
            }
    }).then((res)=>{
        console.log(res.data);
        proxy.$modal.closeLoading();
        ElMessageBox.alert("请求成功");
    }).catch((err,res)=>{
        proxy.$modal.closeLoading();
        ElMessageBox.alert("请求失败");
    });

let tableData = ref([]);
let queryFormRef = ref();
let queryParams = reactive({
    ownerBase: '',
    operationType: '',
    vin: '',
    vehicleBrand: '',
    vehicleAliasName: '',
    incomeSettle: '',
    orderId: '',
    handoverNo: '',
    orderDate: [],
    agency: '',
    tdpStartLocation: '',
    tdpEndLocation: '',
    operationEndTime: [],
    tdpCode: '',
})
let page = reactive({
    pageNum:1,
    pageSize:10,
})
let pageTotal = ref(0);