我是一个完整的Web开发新手,我也是一个新的Javascript。我正试图使一个quizlet风格的网站,用户可以输入的主题和特定的主题,他们不是很好,然后他们得到的实践问题回到一个flashcard.js文件呈现我有。
为此,我在nextjs中编写了一个API来生成这些练习题,我知道api可以工作,因为我看到它打印出这些问题,但是我不知道如何将数据解析到flashcard.js文件中。
这是我的API中的处理程序的样子:
import { Configuration, OpenAIApi } from 'openai';
import { NextApiRequest, NextApiResponse } from 'next';
import { NextResponse } from 'next/server';
import { useRouter } from 'next/router';
export default async function handler(req, res) {
const { subject, topic, exam_board, qualification } = req.body;
const questions = await generateQuestions(subject, exam_board, qualification, topic);
console.log(questions);
console.log()
res.status(200).json({ questions });
}
}
我想尝试使用useRouter,但我不能在处理程序中使用它,因此可以接受任何想法。
我已经被困在这几个月,所以任何帮助将不胜感激。
1条答案
按热度按时间wribegjk1#
我认为你可以做的是将结果存储在
state
中。你需要从React中导入
useState
。像这样宣布你的状态。
然后将其作为prop传递给flashcard.js组件。您将需要导入组件。
然后调用该组件并将
questions
状态作为属性传递在该组件中,您可以使用条件渲染,以便当您的状态加载数据时,它将在UI中更新。