我正在开发一个光线投射扩展。
在这个函数中，我需要在查询之前创建或更新一个数据库：
import { useSQL } from "@raycast/utils";
export const useSqlNote = <NoteItem>(query: string) => {
const [ready, setReady] = useState<boolean>(false);
let theData: NoteItem[] = [];
let loadingSelect = true;
let permissionVw;
useEffect(() => {
(async () => {
await create_or_update_db();
setReady(true);
})();
}, [query]);
try {
const { data, isLoading, permissionView } = useSQL<NoteItem>(PATH, query);
if (ready) {
theData = data || [];
loadingSelect = isLoading;
permissionVw = permissionView;
}
} catch (e) {}
return { data: theData, isLoading: loadingSelect, errorView: permissionVw };
};如果数据库已经创建，则没有pb。
但是当需要创建它时，这个过程需要几毫秒--当然，对钩子useSQL的调用会引发一个错误，但是应该处理它。
警告：React检测到命令调用的钩子顺序发生了更改。
...
错误：渲染的挂接比上一次渲染时多。
你知道怎么修吗？
1条答案
按热度按时间2mbi3lxu1#
您没有在组件的顶层调用useQuery。请删除try catch块。
要有条件地调用useQuery钩子，光线投射useQuery的文档指出，您可以使用execute param传递选项以跳过查询的调用。
“options.execute是一个布尔值，表示是否实际执行函数。当函数的一个参数所依赖的内容可能无法立即使用时，这很有用。（例如，取决于一些用户输入）。因为React要求在呈现器上定义每个钩子，这个标志使你能够立即定义钩子，但要等到你有了所有的参数才能执行这个函数。