小的案例(二)– 泛型
最后更新于:2022-04-02 08:13:37
>[success] # ts 泛型配合接口
~~~
1.简单的配合泛型去做解决思路
~~~
>[danger] ##### 案例
* 在请求hook 文件下的
~~~
import axios from 'axios'
import { reactive, ref, toRefs } from 'vue'
function userURLLoader (url: string){
// const res = ref(null)
// const loading = ref(true)
// const loaded = ref(false)
// const error = ref(null)
// axios.get(url).then((rs)=>{
// loading.value =false
// res.value =rs.data
// loaded.value = true
// }).catch((e)=>{
// error.value = e
// })
// return { res,loaded,loading,error}
// 需要定义变量
const res:{error:any,loaded:boolean,loading:boolean,data:T|null} = reactive({
error:null,
loading:true,
loaded:false,
data:null
})
axios.get(url).then((resData)=>{
res.loaded = true
res.loading = false
res.data = resData.data
}).catch((e)=>{
res.error = e
})
return {
...toRefs(res)
}
}
export default userURLLoader
~~~
* 使用
~~~
~~~
';