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

In my database, there are files. every single file has 'IS_DELETE' row, which shows whether this file is deleted or not.

If 'IS_DELETE' row of a file is 0, it means it is not deleted by the writer of the post.

If 'IS_DELETE' row of a file is 1, it means it is deleted by the writer.

However, I use a GET request to render the items.

I made the code so that you can see it clearly. I might mispelled!

test = () => {

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

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

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

return (

<>

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

</>

)}

With this code, I render every file, although some files have '1' in their IS_DELETE row.

I am wondering whether I can conditionally get the items from DB or I get every file and filter my array using a particular function.

FYI, I get the files in this format.

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

Thank you. I'm not good at English. So please be understandable.

Waiting for your wisdom!

CodePudding user response：

No, you cannot modify the response you get from server unless it specifically has an endpoint to do so. It's like sending a letter and awqiting the response - you cannot make the response diffeent unless your recipient allows you to send a letter with a specific request (eg. 'give me only non-deleted items'), but if you're not in charge of the server, the only thing you can do is indeed filtering the items you get in response.

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

CodePudding user response：

you can pass the parameter is_deleted in the url concatenate with the main one

{url}?is_deleted=0

CodePudding user response：

Depending on the database you are using, it is possible to do so. For example, in an SQL database, you could do SELECT * FROM files WHERE IS_DELETE != 0

But you can also do it in the frontend as shown below:

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

CodePudding user response：

my idea is to pass parameter in the url as query string and in the server side you get the value and put it in the database query

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>
))

</>

)}