保定网站建设方案刷赞网站推广ks
在 main.js 中动态设置标题
-
需求:不同的网址浏览器页签名称要不同
-
实现方法:在 main.js 中动态设置标题
// 动态设置页面标题
document.addEventListener('DOMContentLoaded', () => {const title = window.location.pathname.includes("/en/") ? 'Support System' : '支持系统';document.title = title;
});
使用 document.addEventListener('DOMContentLoaded', ...)
确保 DOM 完全加载后再设置标题。
根据 window.location.pathname
判断当前语言,并设置相应的标题。
main.js完整代码如下:
import Vue from "vue";import App from "./App.vue";
import store from "./store";
import router from "./router";
import "virtual:svg-icons-register";import directive from "./directive"; //directive
Vue.use(directive);//VueMeta
import VueMeta from "vue-meta";
Vue.use(VueMeta);//Cookie
import Cookies from "js-cookie";import "@/style.css";
import "animate.css";import "@support/assets/styles/index.scss"; // global css
import "@support/assets/styles/ruoyi.scss"; // ruoyi cssimport "./permission";
import "@/echarts";// VXETable
import VXETable from "vxe-table";
Vue.use(VXETable);
import VXETablePluginExportXLSX from "vxe-table-plugin-export-xlsx";
VXETable.use(VXETablePluginExportXLSX);
import "vxe-table/lib/style.css";
import "xe-utils";import Draggable from "vuedraggable";
Vue.component("Draggable", Draggable);import VueContextMenu from "vue-contextmenu";
Vue.use(VueContextMenu);import Element from "element-ui";
import VueI18n from "vue-i18n";
import en from "element-ui/lib/locale/lang/en";
import zhCN from "element-ui/lib/locale/lang/zh-CN";
import "@support/assets/styles/element-variables.scss";
Element.Dialog.props.closeOnClickModal.default = false;
Element.Dialog.props.appendToBody.default = true;
Element.TableColumn.props.showOverflowTooltip = {type: Boolean,default: true
};
Vue.use(VueI18n)
const i18n = new VueI18n({locale: window.location.pathname.includes("/en/") ? en : zhCN,// locale: en,messages: {en: { ...en },zhCN: { ...zhCN }}
});Element.locale(i18n.locale)Vue.use(Element, {size: Cookies.get("size") || "medium" ,// set element-ui default size// i18n: (key, value) => i18n.t(key, value)
});import { NofeelUI } from "nofeel-ui";
Vue.use(NofeelUI);Vue.config.productionTip = false;import "./prototype.js";import "@support/utils/observe";// 动态设置页面标题
document.addEventListener("DOMContentLoaded", () => {const title = window.location.pathname.includes("/en/") ? "Support System" : "支持系统";document.title = title;
})export default new Vue({el: "#app",router,store,// i18n,render: (h) => h(App)
});