Home > Net >  I want to know how to got COUNT from SQL in reactjs
I want to know how to got COUNT from SQL in reactjs

Time:12-17

my request is good but i want to know how can i use my response in React.

SQL request :

    ```
    exports.countAllComments = async (req, res) => {
      const pId = req.params.id;
    
      db.query(
        "SELECT COUNT(*) FROM comments WHERE post_id = ?",
        [pId],
        (err, count) => {
          if (err) {
            res.status(500).json({ err });
            console.log(err);
          } else {
            console.log(count)
            res.status(200).json(count);
          }
        }
      );
    };
    ```
    

Front for fetch count:

```
    const [countData, setCountData] = useState(0);
    
      useEffect(() => {
        const fetchCount = async () => {
          try {
            const fetchData = await Axios.get(
              `http://localhost:3001/api/post/comment-count/${post.id}`,
              {
                headers: { Authorization: `Bearer ${test1.token}` },
              }
            );
            setCountData(fetchData.data[0]);
          } catch (err) {}
        };
        fetchCount();
      }, [post.id, test1.token]);
    
      console.log(countData);
    ```

console log return : "{COUNT(*): 4}" how can i get (4)

CodePudding user response:

given your trivial example, the trivial solution would be something like -

fetchData.data[0]['COUNT(*)']

however, you should really have a think about the contract on the API, and enforce a certain return type from your API, and not just simply return the response from the SQL query. i.e. your API could possibly return an object like -

{ count: x }

where its up to your API to transform the result from the SQL query in a way that satisfies the contract, that way your React client is disconnected from your database layer and only cares about your API contract.

That way your client side becomes something like -

fetchData.data.count

which wouldn't break if the query where to be updated in some way etc.

  • Related