英文:
Qwik useState Error with Supabase Auth Component
问题
我知道这里没有太多关于Qwik的内容，但我想知道是否有人在根本上理解组件渲染的人可以帮助我解决我的问题。我正在尝试将Supabase Auth UI放入我的component$函数中，如下所示：
import { component$ } from "@builder.io/qwik";
import { createClient } from "@supabase/supabase-js";
import { Auth } from '@supabase/auth-ui-react';
const supabase = createClient(`my-url`, `my-key`);
export default component$(() => {
return (
<Auth supabaseClient={supabase} />
);
})
这会产生以下错误：
内部服务器错误：无法读取 null 的属性（读取 'useState'）
文件：/dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:1461:26
在 useState (C:\Users\isaac\Downloads\VS Code\planner\node_modules\react\cjs\react.development.js:1622:21)
在 k (file:///C:/Users/isaac/Downloads/VS%20Code/planner/node_modules/@supabase/auth-ui-react/dist/index.es.js:1211:48)
在 invoke (../../../dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:1461:26)
在 renderNode (../../../dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:4129:17)
在 processData$1 (../../../dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:4143:16)
在 ../../../dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:4210:26
在 Array.reduce (<anonymous>)
在 walkChildren (../../../dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:4195:21)
在 renderNodeVirtual (../../../dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:3688:21)
在 renderNode (../../../dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:4120:16) (x2)
这是否与延迟加载和组件渲染时的useState表现奇怪有关？
英文:
I know there's not a lot of Qwik content on here, but I was wondering if anyone who fundamentally understands component rendering can help me with my question. I am trying to place a Supabase Auth UI into my component$ function like this:
import { component$ } from "@builder.io/qwik";
import { createClient } from "@supabase/supabase-js";
import { Auth } from '@supabase/auth-ui-react'
const supabase = createClient(`my-url`, `my-key`)
export default component$(() => {
return (
<Auth supabaseClient={supabase} />
);
})
which produces this error:
Internal server error: Cannot read properties of null (reading 'useState')
File: /dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:1461:26
at useState (C:\Users\isaac\Downloads\VS Code\planner\node_modules\react\cjs\react.development.js:1622:21)
at k (file:///C:/Users/isaac/Downloads/VS%20Code/planner/node_modules/@supabase/auth-ui-react/dist/index.es.js:1211:48)
at invoke (../../../dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:1461:26)
at renderNode (../../../dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:4129:17)
at processData$1 (../../../dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:4143:16)
at ../../../dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:4210:26
at Array.reduce (<anonymous>)
at walkChildren (../../../dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:4195:21)
at renderNodeVirtual (../../../dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:3688:21)
at renderNode (../../../dist-dev/tsc-out/packages/qwik/src/core/util/implicit_dollar.js:4120:16) (x2)
Does this have to do with lazy-loading and useState being weird at the time of this component rendering?
答案1
得分: 1
你只能在使用qwikify$()包装React组件之后才能使用React组件。
这里是一个qwik supabase身份验证的工作示例。
英文:
you can't use React component without wrapping it with qwikify$()
Here is a qwik supabase auth working example
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论