The pit of query value in vue-router
Problem description
When using $(), query is used, and data of type Boolean is passed, but the values of attributes in query will become strings.
this.$({ name:'product', query: {canSee: false} });
The value of query is taken directly from the page URL, and the type of the parameter on the page URL can only be a string type.
Solution
1. Before passing the value, put the parameters to be passed into an object, put them into the query, and then perform () processing. After reaching the target page, perform () processing to restore the object. The advantage of this method is that it can handle multiple parameters at once and is highly applicable, so it is recommended to use this method.
2. No processing is done before passing the value. After arriving at the target page, the data that was originally non-string is processed separately (). The disadvantage is that string type data cannot be processed in this way, so make sure that the data is not string type. It has great limitations and is not recommended to apply.
vue-router query,parmas,meta parameters
, displayed in the navigation bar? After that, it is equivalent to a get request to pass the parameter
({path:'/login',query:{ 'redirect':'/home'}}) ({name:'Login',query:{ 'redirect':'/home'}})
, will not be displayed, which is equivalent to post requesting to pass parameters. Currently, the test does not have query, and it disappears after refreshing.
({name:'Login',parmas:{ 'redirect':'/home'}}) ({name:'Login',query:{ 'redirect':'/home'}},parmas:{ 'redirect':'/home'}})
When using parmas to pass arguments in vue, you must use name to jump, and it must be passed with query? Otherwise, it will not be received; or the route is set /:XX to receive this parameter
, not displayed, test failed
({name:'Login',meta:{ 'redirect':'/home'}})
Summarize
The above is personal experience. I hope you can give you a reference and I hope you can support me more.