nuxtjsのVueRouterのpushで、params[]=foo¶ms[]=bar みたいなことをしたかった
環境はnuxtjs2.x。Nodejsは10.x。
this.$router.push('foobar', { query: { params: ['foo', 'bar'] } })
みたいなので、通常だと http://xxxxxx?params=foo¶ms=bar というようなURLになる。
どうも、調べてみると queryString を使用して
parseQuery: function(query) { return queryString.parse(query, { arrayFormat: 'bracket' }) }, stringifyQuery: function(params) { if (0 === Object.keys(params).length) { return '' } else { return ( '?' + queryString.stringify(params, { arrayFormat: 'bracket' }) ) } }
このように書けばいいよというのを見つけた。
NodeJS 標準の queryString には arrayFormat ってつけるところないじゃないのん ρ(・ω・、)
そこで、query-string というライブラリを使用したらいいことが分かった。
nuxt.config.js に以下を追加する。
parseQuery と stringifyQuery の中で require しているのは、nuxt.config.js の最初(module.exports の外)に書いても、parseQuery などの中では queryString is not defined のエラーが出るから。
router: { parseQuery: function(query) { const queryString = require('query-string') return queryString.parse(query, { arrayFormat: 'bracket' }) }, stringifyQuery: function(params) { const queryString = require('query-string') if (0 === Object.keys(params).length) { return '' } else { return ( '?' + queryString.stringify(params, { arrayFormat: 'bracket' }) ) } } }

たのしい ( 厂・ω・ )厂うぇーい