[FIXED] How to destructure object in React with special characters in key

Issue

Backend returns an object, and one of the key-value, I would handle differently, how can I split up object?

useEffect(() => {
    const tempUserShortId = getTempUserShortId()
    axios({
        method: 'get',
        url: `questionList?tempUserId=${tempUserShortId}&questionIds[]=6f50dbea-196b-4fb6-82ee-fbade62aab98&questionIds[]=6f50dbea-196b-4fb6-82ee-fbade62aab99&questionIds[]=6f50dbea-196b-4fb6-82ee-fbade62aab9a`,
        headers: { crossDomain: true },
    }).then((res) => {

        const {'6f50dbea-196b-4fb6-82ee-fbade62aab9a', ...rest} = res.data;
        setQuestions(rest)
    })
}, [ind])

It says: ':' expected.ts(1005

Found this online:

  const removeKey = () => {
    setEmployee(current => {
      // 👇️ remove salary key from object
      const {salary, ...rest} = current;

      return rest;
    });
  };

https://bobbyhadz.com/blog/react-remove-key-from-state-object

It does not work.

Got back from backend a structure like this:

{
    "6F50DBEA-196B-4FB6-82EE-FBADE62AAB99": {
        "text": "Mennyire forradalmi az ETH 2.0 bevezetése?",
        "options": {
            "1CD0D2C0-7494-4BE6-ADE6-E454816B584E": {
                "text": "Forradalmi mert PoW helyett PoS lesz. Kevesebb energiát fog fogyasztani a rendszer. Viszont ez még mindig nem skálázható megoldás, a shardingot még nem tudja, és még hosszú évekig nem is fogja tudni, így a tranzakciós díj ugyanúgy magas fog maradni.",
                "rating": {}
            }
        }
    },
    "6F50DBEA-196B-4FB6-82EE-FBADE62AAB98": {

Solution

You have to focus the key of your object and set it to "_" to tell that you will not use it

const obj = {
    "6f50dbea-196b-4fb6-82ee-fbade62aab9a": "cool",
    name: "test",
    value: 3
}
const {"6f50dbea-196b-4fb6-82ee-fbade62aab9a": _, ...rest} = obj // rest equal {name: "test", value: 3}

Answered By – SCHYNS Anthony

Answer Checked By – Mildred Charles (Easybugfix Admin)

Leave a Reply

(*) Required, Your email will not be published