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' }) ) } } }
たのしい ( 厂・ω・ )厂うぇーい