devttl/WebStack-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修复重新加载bootstrap.js导致下拉菜单失效；修复#11

Browse Source
This commit is contained in:
anjaxs
2023-03-15 22:05:28 +08:00
parent 8dbc1dab67
commit e5275312af
5 changed files with 2595 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2580
public/assets/js/all.js Normal file
View File

File diff suppressed because one or more lines are too long

4
public/index.html
View File

@@ -36,9 +36,9 @@
<body class="page-body">
<div id="app"></div>
<!-- built files will be auto injected -->
<!-- <script src="./assets/js/jquery-1.11.1.min.js"></script>
<script src="./assets/js/jquery-1.11.1.min.js"></script>
<script src="./assets/js/bootstrap.min.js"></script>
<script src="./assets/js/TweenMax.min.js"></script>
<!--<script src="./assets/js/TweenMax.min.js"></script>
<script src="./assets/js/resizeable.js"></script>
<script src="./assets/js/joinable.js"></script>
<script src="./assets/js/xenon-api.js"></script>

16
src/assets/js/app.js
View File

@@ -1,20 +1,12 @@
export function loadJs() {
const jsArr = [
{ id: "js-1", src: "./assets/js/jquery-1.11.1.min.js" },
{ id: "js-2", src: "./assets/js/bootstrap.min.js" },
{ id: "js-3", src: "./assets/js/TweenMax.min.js" },
{ id: "js-4", src: "./assets/js/resizeable.js" },
{ id: "js-5", src: "./assets/js/joinable.js" },
{ id: "js-6", src: "./assets/js/xenon-api.js" },
{ id: "js-7", src: "./assets/js/xenon-toggles.js" },
{ id: "js-8", src: "./assets/js/xenon-custom.js" },
{ id: "js-9", src: "./assets/js/app.js" },
// { id: "js-1", src: "./assets/js/jquery-1.11.1.min.js" },
// { id: "js-2", src: "./assets/js/bootstrap.min.js" },
{ id: "js-3", src: "./assets/js/all.js" },
];
const srcArr = document.getElementsByTagName("script");
for (let i = 0; i < srcArr.length; i++) {
for (let j = 0; j < jsArr.length; j++) {
// console.log(`srcArr[${i}]`, srcArr[i]);
// console.log(`jsArr[${j}]`, jsArr[j]);
if (srcArr[i].id == jsArr[j].id) {
srcArr[i].remove();
}
@@ -24,8 +16,8 @@ export function loadJs() {
const body = document.getElementsByTagName('body')[0];
for (let i = 0; i < jsArr.length; i++) {
const script = document.createElement("script");
script.src = jsArr[i].src;
script.id = jsArr[i].id;
script.src = jsArr[i].src;
script.defer = true;
body.append(script);
}

7
src/main.js
View File

@@ -11,7 +11,6 @@ import './assets/css/xenon-core.css'
import './assets/css/xenon-components.css'
import './assets/css/xenon-skins.css'
import './assets/css/nav.css'
import { loadJs } from './assets/js/app.js'
Vue.config.productionTip = false
Vue.use(VueRouter)
@@ -26,12 +25,6 @@ const router = new VueRouter({
mode: 'history'
})
router.afterEach((to, from, next) => {
console.log("to => ", to, "from => ", from, "next => ", next);
if (to.path == '/' && to.hash == '') {
loadJs();
}
})
new Vue({
render: h => h(App),

18
src/views/index.vue
View File

@@ -5,10 +5,10 @@
<header class="logo-env">
<!-- logo -->
<div class="logo">
<a href="#" class="logo-expanded">
<a href="javascript:void(0)" class="logo-expanded">
<img src="../assets/images/logo@2x.png" width="100%" alt="" />
</a>
<a href="#" class="logo-collapsed">
<a href="javascript:void(0)" class="logo-collapsed">
<img
src="../assets/images/logo-collapsed@2x.png"
width="40"
@@ -17,10 +17,10 @@
</a>
</div>
<div class="mobile-menu-toggle visible-xs">
<a href="#" data-toggle="user-info-menu">
<a href="javascript:void(0)" data-toggle="user-info-menu">
<i class="linecons-cog"></i>
</a>
<a href="#" data-toggle="mobile-menu">
<a href="javascript:void(0)" data-toggle="mobile-menu">
<i class="fa-bars"></i>
</a>
</div>
@@ -63,10 +63,10 @@
<nav class="navbar user-info-navbar" role="navigation">
<ul class="user-info-menu left-links list-inline list-unstyled">
<li class="hidden-sm hidden-xs">
<a href="#" data-toggle="sidebar"><i class="fa-bars"></i></a>
<a href="javascript:void(0)" data-toggle="sidebar"><i class="fa-bars"></i></a>
</li>
<li class="dropdown hover-line language-switcher">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<a href="javascript:void(0)" class="dropdown-toggle" data-toggle="dropdown">
<img :src="lang.flag" /> {{ lang.name }}
</a>
<ul class="dropdown-menu languages">
@@ -75,7 +75,7 @@
v-for="langItem in langList"
:key="langItem.key"
>
<a href="#" @click="lang = langItem">
<a href="javascript:void(0)" @click="lang = langItem">
<img :src="langItem.flag" /> {{ langItem.name }}
</a>
</li>
@@ -109,7 +109,7 @@
import WebItem from "../components/WebItem.vue";
import Footer from "../components/Footer.vue";
import itemsData from "../assets/data.json";
// import { loadJs } from '../assets/js/app.js'
import { loadJs } from '../assets/js/app.js'
export default {
name: "Index",
@@ -137,7 +137,7 @@ export default {
},
created() {
this.lang = this.langList[0];
// loadJs();
loadJs();
},
methods: {
transName(webItem) {