How save multiple params in variable and add to in url?

Question

I have many parameters that I would like to save in the param variable and add it to the url.

How to save this parameter filter% 5Binprogress% 5D = true in the variable param?. I did not have problem with expand --> expand: track

In tab network return --> "https://spotify?expand=track&filter%255Binprogress%255D=true"

should be --> "https://spotify?expand=track&filter%5Binprogress%5D=true"

%255D ---> should be %5D

const param = {
    expand: track,
    'filter%5Binprogress%5D': true  //problem here
}


axios({
    url: "https://spotify?expand=track&filter%5Binprogress%5D=true",
    method: "GET",
    headers: {
        'Authorization': .....
    },
    param: param
})

`expand` is a valid [identifier](https://developer.mozilla.org/en-US/docs/Glossary/Identifier), why *would* it have a problem? This is a very basic JS error, unrelated to React, Axios or even HTTP: invalid identifiers need quoting as object property names. — jonrsharpe, Jun 25 '19 at 07:41
No, it's not, that's why you're getting an error. See e.g. https://stackoverflow.com/q/4348478/3001761 for explanation. — jonrsharpe, Jun 25 '19 at 07:46
I guess https://stackoverflow.com/questions/4348478/what-is-the-difference-between-object-keys-with-quotes-and-without-quotes is the correct one. I can't find a question specifically for "what are valid property names". There is [this question](https://stackoverflow.com/questions/2348867/why-are-some-object-literal-properties-quoted-and-others-not) which is close but still a dupe to the previous one. — VLAZ, Jun 25 '19 at 07:51
People, I mean, is adding such a thing `filter% 5Binprogress% 5D` as a property a is good solution or is it possible to write it differently? Is this done in real applications? — Umbro, Jun 25 '19 at 07:57
I don't know why do you want to add this property. So, "is it a good solution" is unclear. — VLAZ, Jun 25 '19 at 08:02
You seem to have the query parameter in both the URL *and* in the added query params - why? Also if you're getting `%255D` that means the `%` is being encoded to `%25`, so you need to start with an *un*encoded value. — jonrsharpe, Jun 25 '19 at 11:29

score 0 · Answer 1 · edited Jun 25 '19 at 07:49

0

It's because you have a special character in object property.

Try using quotation (single or double)

const param = {
    expand: track,
    "filter%5Binprogress%5D": true
}


axios({
    url: "https://spotify?expand=track&filter%5Binprogress%5D=true",
    method: "GET",
    headers: {
        'Authorization': .....
    },
    param: param
})

edited Jun 25 '19 at 07:49

jonrsharpe

115,751
26
228
437

answered Jun 25 '19 at 07:48

Ivan Gonzalez

36
2

Charlie · Answer 2 · 2019-06-25T07:53:38.820

-2

Either use quotes or use the bracket notation.

const param = {
    expand: track
}

param['filter%5Binprogress%5D'] = true;

Or using quotes:

const param = {
        expand: track,
        "filter%5Binprogress%5D": true 

    }

edited Jun 25 '19 at 07:53

answered Jun 25 '19 at 07:48

Charlie

22,886
11
59
90

`{ 'filter%5Binprogress%5D': true }` is a valid object literal. – VLAZ Jun 25 '19 at 07:52
Yes - edited the answer – Charlie Jun 25 '19 at 07:54

How save multiple params in variable and add to in url?

2 Answers2