Js uses functional programming to convert strings into arrays. Every time you submit data, you have to manually refresh the page and cannot modify it on the original page. How to solve this problem?

RT, I use the following function to store the input in the input box into an array format

this.whitelists = this.whitelists.map(x =>({
          user_ids: x.user_ids.split(",").filter(x => x.trim()).map(x => Number(x)),
          treatment: x.treatment,
        }));

the original format is as follows

{
    "name":"test",    
    "whitelists":[
        {
            "user_ids":"10, 20",
            "treatment":"1"
        }
    ],
    "id":1
}

the required format is as follows

{
    "name":"test",    
    "whitelists":[
        {
            "user_ids":[10, 20],
            "treatment":"1"
        }        
    ],
    "id":1
}
The method above converts the user_ids string in the whitelists array to the array format, but there is a problem. After each submission, I need to manually refresh the page before I can submit it again. If something goes wrong, you can"t correct the wrong place and then submit it. You have to refresh it. After refreshing, you have to type all the input boxes again. It"s troublesome to have more input boxes.
I"ve tested it, and if you comment out the above function, you can submit it immediately after modification, without the need to manually refresh the page.
Please give me some advice. I now need to change the input into an array format. At the same time, I also need to submit it immediately after modification. I don"t have to refresh the page manually. What should I do? Thank you

Mar.13,2021
Menu