Closed
Description
<template>
<block>
<view>{{request.loading}}</view>
<view>{{request.data}}</view>
<view>{{request.error}}</view>
</block>
</template>
<script>
export default {
setup() {
// 由于要保证request内部的变量不失活。 这里简单的可以将request直接抛出
const request = useRequest(getUsername);
return {
request,
};
},
};
</script>如果 data 是一个对象，那么使用起来会比较的 ugly, request.data.obj.a
reqeust 目前是一个 reactive 对象，如果解构，那么就会失去响应式。能否把 request 定义成一个普通的对象，里面的 data loading 等值定义为 ref, 这样解构后，响应式依然存在。这样使用上也会和 react 版的一致。
Description
Solution
可以参考 @tanstack/vue-query 的 API
// 其中 isPending, isError, data, error 都是 ref 类型的值
const { isPending, isError, data, error } = useQuery({
queryKey: ['todos'],
queryFn: getTodos,
})