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

Question

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!

k-wasilewski · Accepted Answer · 2022-01-01 10:58:27Z

1

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

answered Jan 1, 2022 at 10:58

k-wasilewski

4,6914 gold badges18 silver badges39 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Aden Lee Over a year ago

Wow. This works really fine!

mmantach · Accepted Answer · 2022-01-01 10:59:00Z

0

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

{url}?is_deleted=0

answered Jan 1, 2022 at 10:59

mmantach

14011 bronze badges

1 Comment

Aden Lee Over a year ago

I'm sorry but I can't understand what you're talking about :( Maybe you can add some explanation!

sgck · Accepted Answer · 2022-01-01 11:06:41Z

0

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

answered Jan 1, 2022 at 11:06

sgck

1513 silver badges10 bronze badges

1 Comment

Aden Lee Over a year ago

I think this is the same way! I had to use filter(). Thank you sigc. simple & clean!

mmantach · Accepted Answer · 2022-01-01 11:54:14Z

0

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

</>

)}

answered Jan 1, 2022 at 11:54

mmantach

14011 bronze badges

Collectives™ on Stack Overflow

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

4 Answers 4

1 Comment

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related