Skip to content

Commit 08f0ca0

Browse files
KingMariokazupon
authored andcommitted
Approach of conversion for array in query to avoid breaking change (vuejs#817)
* Approach of conversion for array in query to avoid breaking change * Minor revise * Minor revise * Explain more clearly * Minor revise * Use computed property instead * Update migration-vue-router.md * Insist in adding a computed property * Update migration-vue-router.md
1 parent 5233ccb commit 08f0ca0

File tree

1 file changed

+17
-0
lines changed

1 file changed

+17
-0
lines changed

src/v2/guide/migration-vue-router.md

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -236,6 +236,23 @@ if (route.meta.requiresAuth) {
236236
</div>
237237
{% endraw %}
238238

239+
### [] Syntax for Arrays in Queries <sup>removed</sup>
240+
241+
When passing arrays to query parameters the QueryString syntax is no longer `/foo?users[]=Tom&users[]=Jerry`, instead, the new syntax is `/foo?users=Tom&users=Jerry`. Internally, `$route.query.users` will still be an Array, but if there's only one parameter in the query: `/foo?users=Tom`, when directly accessing this route, there's no way for the router to know if we were expecting `users` to be an Array. Because of this, consider adding a computed property and replacing every reference of `$route.query.users` with it:
242+
243+
```javascript
244+
export default {
245+
// ...
246+
computed: {
247+
// users will always be an array
248+
users () {
249+
const users = this.$route.query.users
250+
return Array.isArray(users) ? users : [users]
251+
}
252+
}
253+
}
254+
```
255+
239256
## Route Matching
240257

241258
Route matching now uses [path-to-regexp](https://github.com/pillarjs/path-to-regexp) under the hood, making it much more flexible than previously.

0 commit comments

Comments
 (0)