UniversalRouter params, query and hash
HTML
<script src="https://unpkg.com/universal-router@3/universal-router.js"></script>
JavaScript
// import UniversalRouter from 'https://github.com/kriasoft/universal-router'
// import queryString from 'https://github.com/sindresorhus/query-string'
const location = new URL('http://example.com/user/jhon?query=and&hash#example')
const queryString = {
parse(qstr) {
const query = {}
const a = (qstr[0] === '?' ? qstr.substr(1) : qstr).split('&')
for (let i = 0; i < a.length; i++) {
const b = a[i].split('=')
query[decodeURIComponent(b[0])] = decodeURIComponent(b[1] || '')
}
return query
}
}
const router = new UniversalRouter({
path: '/user/:username',
action(context) {
console.log(context.path) // => '/user/jhon'
console.log(context.params) // => { username: 'jhon' }
console.log(context.query) // => { query: 'and', hash: '' }
console.log(context.hash) // => '#example'
return /*...*/`
href: ${location.href}<br/>
path: ${context.path}<br/>
params: ${JSON.stringify(context.params, null, 2)}<br/>
query: ${JSON.stringify(context.query, null, 2)}<br/>
hash: ${context.hash}`
}
})
console.log(location)
router.resolve({
path: location.pathname,
query: queryString.parse(location.search),
hash: location.hash,
}).then(page => {
document.body.innerHTML = page
})