編碼的世界 / 優質文選 / 生涯

vue項目中引入外部css以及js文件的方法。import 得使用


2021年11月20日
-   

引入css<template></template> <style scoped>
 @import "../assets/common/common.css";
</style>
或者是
<style scoped src="../../static/css/test.css"></style>
引入js1,在需要的頁面引入,
import '../../../static/js/jquery-1.9.1.min.js'   //jq插件
import util from '../../common/js/util'          //自己寫的一個js文件。然後可以通過util來引用這個文件裏面的函數。比如util.getTime()
 
import { mymixin } from "@/assets/js/mixin";
export default {   mixins: [mymixin],
然後這個mixin的頁面是這樣的
import {         getSpecialChaptertree,     getChapterInfoNew,     getChapterbookletQuestioncategoryInfo,     addResource } from "@/api/api";//這裏是引入的接口名字以便下面的函數去訪問接口 export const mymixin={     data(){         return{         //   num:1,             }     },     methods:{       // 獲取學段列表             getStudySection() {                 this.studysectionlist = []                 this.allStudySection.forEach(v => {                     this.studysectionlist.push(v.studysection)                 })                 this.studysection = this.studysectionlist[0]                 this.getSubjects(this.studysection)             },
},//methods }
 
2,在main.js全局引入,每個頁面都可以直接使用不必在調用了
//引入echart import echarts from 'echarts' Vue.prototype.$echarts = echarts 
然後需要的頁面不用引入直接使用 let myChartPie = this.$echarts.init(document.getElementById('chartPie'));

熱門文章