gpt4 book ai didi

json - 如何将nextjs api创建的json数据发送到新路由?

转载 作者:行者123 更新时间:2023-12-02 22:47:33 25 4
gpt4 key购买 nike

我是一个完全的 Web 开发菜鸟,而且我对 Javascript 也有点陌生。我正在尝试制作一个测验风格的网站,用户可以在其中输入他们不太擅长的主题和特定主题,然后他们会得到在我拥有的 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,但我无法在处理程序中使用它,因此对任何想法持开放态度。

我已经在这个问题上坚持了几个月了,所以我们将不胜感激。

最佳答案

我认为您可以做的是将结果存储在状态中。

您需要从 React 导入 useState

import { useState } from 'React';

并像这样声明你的状态。

const [questions, setQuestions] = useState(<default-state-value>);

然后将其作为 props 传递给 flashcard.js 组件。您将需要导入该组件。

import FlashCard from '<path-to-flashcard.js>'

然后调用该组件并将问题状态作为 Prop 传递

<FlashCard questionsProp={questions} />

在该组件内,您可以使用条件渲染,以便当您的状态加载数据时,它将在 UI 中更新。

关于json - 如何将nextjs api创建的json数据发送到新路由?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/76323622/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com