浏览器地址栏发生变化,默认会reload, 有两种方式可以避免
浏览器地址栏发生变化,默认会reload, 有两种方式可以避免:
一种是hash表示全路径
一种是利用history-api---pushState
--问题是当地址栏发生变化,但路由中不存在时,就会发生加载新页面,需要服务器配合就不会出现404
nginx
location / {
try_files $uri $uri/ /index.html;
}
NATIVE nodejs
const http = require('http')
const fs = require('fs')
const httpPort = 80
http.createServer((req, res) => {
fs.readFile('index.htm', 'utf-8', (err, content) => {
if (err) {
console.log('We cannot open "index.htm" file.')
}
res.writeHead(200, {
'Content-Type': 'text/html; charset=utf-8'
})
res.end(content)
})
}).listen(httpPort, () => {
console.log('Server listening on: http://localhost:%s', httpPort)
})
---配合如下,客户端提示
const router = new VueRouter({
mode: 'history',
routes: [
{ path: '*', component: NotFoundComponent }
]
})
T