效果如输入
http://zhengxie.imlimit.com
浏览器自动生成为
http://zhengxie.imlimit.com/nationwide/
mian.js
import Vue from "vue";
import App from "./App";
import router from "./router";
import ElementUI from "element-ui";
import "element-ui/lib/theme-chalk/index.css";
import VueQuillEditor from "vue-quill-editor";
import "quill/dist/quill.core.css";
import "quill/dist/quill.snow.css";
import "video.js/dist/video-js.css";
import "videojs-contrib-hls";
import "quill/dist/quill.bubble.css";
const hls = require("videojs-contrib-hls")
Vue.use(hls)
import {
getTitle,
getProvince
} from "@/api/common";
Vue.use(VueQuillEditor);
Vue.use(ElementUI);
router.beforeEach((to, from, next) => {
getTitle().then(res => {
if (to.name == "index" || !to.meta) {
document.title = res.title;
} else if (to.meta.title) {
document.title = to.meta.title + "-" + res.title;
}
if (to.name == "registration") {
const title = localStorage.getItem("province") ?
localStorage.getItem("province") + "网上报名" :
"全国网上报名";
document.title = title + "-" + res.title;
}
document
.querySelector('meta[name="keywords"]')
.setAttribute("content", res.keywords);
document
.querySelector('meta[name="description"]')
.setAttribute("content", res.description);
});
let pinYin = 'nationwide'
// console.log(from)
if (from.path == '/') {
pinYin = to.params.pinYin ? to.params.pinYin : 'nationwide'
} else {
pinYin = from.params.pinYin ? from.params.pinYin : 'nationwide'
}
if (pinYin != localStorage.getItem("pinYin") && pinYin != 'nationwide') {
if (pinYin) {
getProvince().then(res => {
localStorage.setItem("pinYin", pinYin);
let status = false;
for (const item of res) {
if (item.pinYin == pinYin) {
localStorage.setItem("province", item.value);
status = true;
}
}
if (!status) {
router.push({
path: '/' + pinYin + "/four",
params: {
pinYin: pinYin
}
});
return;
} else {
if (to.path == '/' + to.params.pinYin || to.path == '/') {
let path = to.path
if (from.path == '/' && (to.matched.length === 0 || to.matched[0].path == '/:pinYin')) {
path = '/'
}
next({
path: '/' + pinYin + path,
query: to.query,
params: {
pinYin: pinYin
}
});
return
}
next();
}
});
return
} else {
localStorage.removeItem("province");
}
} else if (pinYin == 'nationwide') {
localStorage.removeItem("province");
localStorage.removeItem("pinYin");
}
// console.log(to)
if (to.path == '/' + to.params.pinYin || to.path == '/') {
let path = to.path
if (from.path == '/' && (to.matched.length === 0 || to.matched[0].path == '/:pinYin')) {
path = '/'
}
next({
path: '/' + pinYin + path,
query: to.query,
params: {
pinYin: pinYin
}
});
return
}
// console.log(1)
next();
});
Vue.prototype.imgUrl = function (e) {
if (!e) {
return "";
} else if (e.substring(0, 4) != "http") {
return "http://ambcdn.eduugo.com" + e;
} else {
return e;
}
};
Vue.prototype.path = function (e) {
const pinYin = localStorage.getItem("pinYin") ? localStorage.getItem("pinYin") : 'nationwide'
return '/' + pinYin + e
};
new Vue({
el: "#app",
router,
components: {
App
},
template: "<App/>"
});
router.js
import Vue from "vue";
import Router from "vue-router";
const index = () => import("@/page/index.vue");
const personal = () => import("@/page/personal.vue");
const login = () => import("@/page/login.vue");
Vue.use(Router);
export default new Router({
mode: "history",
routes: [{
path: "/:pinYin/",
name: "index",
meta: {
title: "模拟政协",
keepalive: true
},
component: index
},
{
path: "/:pinYin/vcd/:id",
name: "vcd",
meta: {
title: "视频详情"
},
component: ()=>import('../page/vcd')
}
],
scrollBehavior(to, from, savedPosition) {
// savedPosition 会在你使用浏览器前进或后退按钮时候生效
// 这个跟你使用 router.go() 或 router.back() 效果一致
// 这也是为什么我在 tab 栏结构中放入了一个 点击回退 的按钮
if (savedPosition) {
return savedPosition;
} else {
// 如果不是通过上述行为切换组件,就会让页面回到顶部
return {
x: 0,
y: 0
};
}
}
});