英文:
How do i query xata data base using vue 3
问题
以下是代码部分的翻译：
methods: {
async getData() {
const xata = getXataClient();
const page = await xata.db.quiz
.select(["questions", "answer", "options", "selected"])
.getPaginated({
pagination: {
size: 15,
},
});
console.log(page.records);
},
},
请注意，这是您提供的代码的翻译部分，没有其他内容。如果您有任何其他问题，请随时提出。
英文:
` methods: {
async getData() {
const xata = getXataClient();
const page = await xata.db.quiz
.select(["questions", "answer", "options", "selected"])
.getPaginated({
pagination: {
size: 15,
},
});
console.log(page.records);
},
},`
I'm new to Xata data base, and i've created a data base but i can't query xata using vue js
答案1
得分: 1
你实际上无法从Vue中查询Xata，因为它是一个前端框架（有关为什么不应该这样做的更多信息，请参阅此处 -> https://xata.io/blog/securely-querying-your-database-on-xata)
如果你需要帮助，我邀请你加入xata的Discord频道。
祝你玩得开心！
英文:
You actually can’t query Xata from vue since it’s a frontend framework (more information on why you shouldn’t do this here -> https://xata.io/blog/securely-querying-your-database-on-xata)
If you want help, I invite you to join xata’s discord channel
Have fun!
答案2
得分: 0
关于Fabien0102的评论的后续：
我建议查看Nuxt 3，它已经不再是测试版，并且为开发者提供了非常愉快的开发体验。
您需要解决您的问题的是server文件夹（位于根目录下），以及一个JS或TS文件，例如：
- server
- api
- quiz.js
- logout.js
- api
然后在您的某个ts文件中：
// 文件路径：server/api/quiz.js
export default defineEventHandler(async () => {
const xata = getXataClient();
const page = await xata.db.quiz
.select(["questions", "answer", "options", "selected"])
.getPaginated({
pagination: {
size: 15,
},
});
return page
})
然后它将在http://localhost:3000/api/quiz上可用。然后在您的vue文件中像往常一样获取它。 （我还建议测试useAsyncData，因为您现在处于Nuxt环境中）
英文:
Follow up on Fabien0102's comment
> You actually can’t query Xata from vue since it’s a frontend framework (more > information on why you shouldn’t do this here ->
> https://xata.io/blog/securely-querying-your-database-on-xata)
I would recommend looking into Nuxt 3 which is out of beta and has ha very pleasent developer experience.
What you need to solve your issue is the server-folder(located in root) and either a JS or TS file with eg.:
- server
- api
- quiz.js
- logout.js
- api
Then in your one of your ts files:
// filepath: server/api/quiz.js
export default defineEventHandler(async () => {
const xata = getXataClient();
const page = await xata.db.quiz
.select(["questions", "answer", "options", "selected"])
.getPaginated({
pagination: {
size: 15,
},
});
return page
})
It will then be available on http://localhost:3000/api/quiz. Then fetch it in your vue file as you would. (I also recommend testing useAsyncData since your now in a nuxt enviroment)
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论