如何使用 React(Next.js) 中的特定值有条件地从数据库中获取项目？

Question

在我的数据库中，有文件。每个文件都有'IS_DELETE'行，显示这个文件是否被删除。

如果一个文件的 'IS_DELETE' 行是 0，这意味着它没有被 post.

的作者删除

如果一个文件的'IS_DELETE'行是1，则表示它已被作者删除。

但是，我使用 GET 请求来呈现项目。

我把代码做了，让你看的清楚。我可能拼错了！

test = () => {

const [files, setFiles] = useState([]);

const getDetails = async () => {
  await get(`URL`)
  .then((res) => {
     setFiles(res)
  })
} 

useEffect=(() => {
  getDetails()
},[])

return (

<>

  files.map((file) => (
   <div>
     {file}
   </div>
))

</>

)}

使用这段代码，我渲染了每个文件，尽管有些文件的 IS_DELETE 行中有“1”。

我想知道我是否可以有条件地从数据库中获取项目要么我获取每个文件并使用特定函数过滤我的数组。

仅供参考，我得到了这种格式的文件。

[
{PK:1, NAME:'Hello.jpg', IS_DELETE: 0}
{PK:2, NAME:'Nice.jpg', IS_DELETE: 1}
{PK:3, NAME:'To.jpg', IS_DELETE: 0}
]

谢谢。我不擅长英语。所以请谅解。

等你的智慧！

Answer 1

不，您不能修改从服务器获得的响应，除非它专门有一个端点可以这样做。这就像发送一封信并等待回复 - 除非您的收件人允许您发送带有特定请求的信件（例如 'give me only non-deleted items'），否则您不能使回复不同，但如果您不负责服务器，您唯一能做的就是过滤您收到的响应项目。

const getDetails = async () => {
  await get(`URL`)
  .then((res) => {
     const filtered = res.filter(file => file.IS_DELETE === 0);
     setFiles(filtered);
  })
}

Answer 2

你可以在 url 中传递参数 is_deleted 与主参数

{url}?is_deleted=0

Answer 3

根据您使用的数据库，可以这样做。例如，在 SQL 数据库中，您可以执行 SELECT * FROM files WHERE IS_DELETE != 0

但您也可以在前端执行，如下所示：

const getDetails = async () => {
  const res = await get(`URL`);
  setDetails(res.filter(file => !file.IS_DELETE));
}

Answer 4

我的想法是在 url 中传递参数作为查询字符串，然后在服务器端获取值并将其放入数据库查询中

test = () => {

const [files, setFiles] = useState([]);

const getDetails = async () => {
  await get(`URL?is_deleted=0`)
  .then((res) => {
     setFiles(res)
  })
} 

useEffect=(() => {
  getDetails()
},[])

return (

<>

  files.map((file) => (
   <div>
     {file}
   </div>
))

</>

)}

如何使用 React(Next.js) 中的特定值有条件地从数据库中获取项目？

How do I conditionally get items from DB using specific value in React(Next.js)?

javascript

api

conditional-statements

reactjs