vue3+ts+vite 标签体内循环的数据渲染后会报错,但是数据能渲染出来
1:这是我渲染的数据
<el-select placeholder="请选择产品类型" class="itemW" v-model="lampPostSearchForm.product">
<el-option v-for="item in productTypeList" :label="item.label" :value="item.value" />
</el-select>
2:这是定义接收接口的数据
const productTypeList = ref<Array<[]>>([])
3:这是调用接口然后把数据给productTypeList ,并且res不定义any也会类型报错
const getAllScreenProductHan = () => {
getAllScreenProduct({ params: {} }).then((res: any) => {
productTypeList.value = res.data
console.log(res)
})
}
4:以下是我封装的api
import { service } from './http';
import type { AxiosResponse } from 'axios';
export const get = <T>(url: string, params?: any):Promise<T> => {
return service.get<T>(url, params )
.then(response => (response.data as any))
.catch(error => {
throw error;
});
}
export const post = <T>(url: string, data?: any):Promise<T> => {
return service.post<T>(url, data)
.then((response:AxiosResponse) => response.data)
.catch(error => {
throw error;
});
}
export const put = <T>(url: string, data?: any):Promise<T> => {
return service.put<T>(url, data)
.then((response:AxiosResponse) => response.data)
.catch(error => {
throw error;
});
}
export const del = <T>(url: string, data?: any):Promise<T> => {
return service.delete<T>(url, data)
.then((response:AxiosResponse) => response.data)
.catch(error => {
throw error;
});
}
4.1:具体的调用方法
import { get, post, del, put } from '@/utils/methods'
import { addScreenParams, searchScreenParams } from './type'
import { param } from '@/utils'
// 添加屏幕
const addScreen = (data: addScreenParams) => {
return post('screen/screen/addScreen', data)
}
// 查询屏幕
const searchScreen = (params: {}) => {
return get('screen/screen/findAllScreen', params)
}
// 获取产品类型 -- select--option、
const getAllScreenProduct = (params: {}) => {
return get('screen/product/getAllScreenProduct', params)
}
export { addScreen, searchScreen, getAllScreenProduct }