如何在Vue3中显示Supadase表

Question

我正在学习Vue和Supadase，我需要创建一个ToDo应用程序。我做了授权，我可以向Supadase提交任务，但我不能让Supadase返回任务以在我的组件中打印它们。我也在使用Pinia来存储我的函数。我需要帮助，因为我不明白为什么它不起作用，因为我的班级团队有相同的代码。

我的组件中有这个功能：

async function fetchAllTasks() {
allTasks.value = await storeTasks.fetchTasks().value;
console.log(allTasks.value);
}
fetchAllTasks();

这个功能在我的商店里：

async fetchTasks() {
const { data: tasks, error } = await supabase
.from("tasks")
.select("*")
.order("id", { ascending: false });
this.tasks = tasks;
},

这段代码在我的模板内的一个表中显示了任务：

<tr v-for="task in allTasks" :key="task">

Answer 1

我在使用Nuxt3试图包含pinia时遇到了同样的问题。

在我的情况下，超市里的超级客户不见了，我无法在那里申报。我只是将它作为一个参数从组件内部传递。

你店里的功能可能是这样的。

async fetchTasks(supabase) {
//...code
}

在你的组件内部。

async function fetchAllTasks() {
allTasks.value = await storeTasks.fetchTasks(supabaseClient).value;
console.log(allTasks.value);
}
fetchAllTasks();

不知道这是否是个好办法，但希望我能帮上忙。