sparkast/components/search/onesearch/onesearch.tsx
2024-04-10 00:11:08 +08:00

25 lines
753 B
TypeScript

import { useEffect, useState } from "react";
import SuggestionBox from "./suggestionBox";
import Suggestion from "./suggestion";
import { useRecoilValue } from "recoil";
import { queryState } from "@/components/state/query";
export default function () {
const [suggestion, setSuggetsion] = useState([]);
const query = useRecoilValue(queryState);
useEffect(() => {
fetch(`/api/suggestion?q=${query}`)
.then((res) => res.json())
.then((data) => {
setSuggetsion(data);
});
}, [query]);
return (
<SuggestionBox>
{suggestion.map((s: string) => {
return <Suggestion key={s}>{s}</Suggestion>;
})}
</SuggestionBox>
);
}