REACT – Supabase

huangapple go评论116阅读模式
英文:

REACT - Supabase

问题

我正在运行这段代码:

  1. import { useEffect, useState } from 'react';
  2. import { createClient } from '@supabase/supabase-js';
  3. const supabase = createClient("https://<project>.supabase.co", '<anon-key>');
  4. const GetBalance = () => {
  5. const [data, setData] = useState([]);
  6. useEffect(() => {
  7. getData();
  8. }, []);
  9. async function getData() {
  10. const { data: udata } = await supabase.from("balances").select();
  11. setData(udata);
  12. }
  13. return (
  14. <ul>
  15. {data.map(transactions => (
  16. <li key={transactions.balance}>{transactions.balance}</li>
  17. ))}
  18. </ul>
  19. )
  20. }
  21. export default GetBalance;

它返回了'Cannot read properties of undefined (reading 'map')'的错误。
我已经在supabase上禁用了RLS,并且表中包含数据且不为空。

这是我的代码中的语法错误吗?还是我配置了supabase项目不正确?
我在网上搜索了并禁用了RLS,但没有任何效果。

我尝试连接到我的supabase数据库,它可以连接但无法显示数据。然后我禁用了RLS,结果出现了这个错误。

英文:

I am Running this piece of code:

  1. import { useEffect, useState } from &#39;react&#39;;
  2. import { createClient } from &#39;@supabase/supabase-js&#39;;
  3. const supabase = createClient(&quot;https://&lt;project&gt;.supabase.co&quot;, &#39;&lt;anon-key&gt;&#39;);
  4. const GetBalance = () =&gt; {
  5. const [data, setData] = useState([]);
  6. useEffect(() =&gt; {
  7. getData();
  8. }, []);
  9. async function getData() {
  10. const { udata } = await supabase.from(&quot;balances&quot;).select();
  11. setData(udata);
  12. }
  13. return (
  14. &lt;ul&gt;
  15. {data.map(transactions =&gt; (
  16. &lt;li key={transactions.balance}&gt;{transactions.balance}&lt;/li&gt;
  17. ))}
  18. &lt;/ul&gt;
  19. )
  20. }
  21. export default GetBalance;

it responds with 'Cannot read properties of undefined (reading 'map').'
I have disables RLS on supabase and the table does include data and is not empty.

Is this a syntactical error in my code? or have I configured my supabase project incorrectly?
I have searched online and disables RLS however it has done nothing

I was trying to connect to my database on supabase but it would connect but not display data. I then disables RLS and it spits out this error

答案1

得分: 0

首先,你可以使用console.log来打印出"data",看看是否有数据返回。看起来"data"是未定义的。你也可以尝试写下面的代码:

  1. {data?.map((transactions) => (
  2. <li key={transactions.balance}>{transactions.balance}</li>
  3. ))}

此外,我相信你有意将下面一行中的实际项目ID和密钥值替换为<project>和<anon-key>,但我只是确认一下:

  1. const supabase = createClient("https://<project>.supabase.co", '<anon-key>');

当然,这些值应该是你从项目仪表板中获取的。

英文:

The first step would be to console.log 'data' to see if you are getting any. Seems like the 'data' is undefined. You could also try writing this:

  1. {data?.map((transactions) =&gt; (
  2. &lt;li key={transactions.balance}&gt;{transactions.balance}&lt;/li&gt;
  3. ))}

Also, I believe you intentionally replaced the actual project id and key values in the line below with <project> and <anon-key>, but just making sure:

const supabase = createClient(&quot;https://&lt;project&gt;.supabase.co&quot;, &#39;&lt;anon-key&gt;&#39;);. Of course, these should be values you get from your project dashboard.

答案2

得分: 0

我发现如果我将这行代码:

const { udata } = await supabase.from("balances").select();

改为:

const { data: udata } = await supabase.from("balances").select();

它应该可以正常工作,因为这是一个变量命名的问题。

英文:

I figured that if i change the line

const { udata } = await supabase.from(&quot;balances&quot;).select();

to

const { data: udata } = await supabase.from(&quot;balances&quot;).select();

it would work as it was a variable issue with the nameing

huangapple
  • 本文由 发表于 2023年8月8日 21:42:30
  • 转载请务必保留本文链接:https://go.coder-hub.com/76860145.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定