Vue中import篇：模块、JS文件、class类文件、数组对象文件、第三方(1)

文末

技术是没有终点的，也是学不完的，最重要的是活着、不秃。

零基础入门的时候看书还是看视频，我觉得成年人，何必做选择题呢，两个都要。喜欢看书就看书，喜欢看视频就看视频。

最重要的是在自学的过程中，一定不要眼高手低，要实战，把学到的技术投入到项目当中，解决问题，之后进一步锤炼自己的技术。

自学最怕的就是缺乏自驱力，一定要自律，杜绝“三天打鱼两天晒网”，到最后白忙活一场。

高度自律的同时，要保持耐心，不抛弃不放弃，切勿自怨自艾，每天给自己一点点鼓励，学习的劲头就会很足，不容易犯困。

技术学到手后，找工作的时候一定要好好准备一份简历，不要无头苍蝇一样去海投简历，容易“竹篮打水一场空”。好好的准备一下简历，毕竟是找工作的敲门砖。

拿到面试邀请后，在面试的过程中一定要大大方方，尽力把自己学到的知识舒适地表达出来，不要因为是自学就不够自信，给面试官一个好的印象，面试成功的几率就会大很多，加油吧，骚年！

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

2.1.1 JS中export函数

2.1.2 JS中export default函数

2.2 多个函数引入

2.3 成组全部引入

三、引入数组、对象JS文件

四、引入class类js文件

五、引入CSS文件

---

vue中经常需要import各种文件，比如样式、组件、方法、js文件、模块等，具体每种如何使用。

一、引入第三方插件

=========

概述

第三方插件，比如echart、jquery等

引入流程

1、先install安装

npm install 插件名称 --save

2、import导入

import echarts from ‘echarts’

3、其他配置

全局引入的需要再main.js中配置，一般每个js库官网中会有说明

二、引入函数方法

========

2.1 单个函数引入

---

2.1.1 JS中export函数

1、js文件的写法

新建一个JS文件util.js

export function testFunciton(options){

//执行代码，注意代码中最后一般都需要return返回值

}

2、引入需要加花括号，支持多个导入

import {testFunction} from ‘./util’; //方法名需要加花括号

2.1.2 JS中export default函数

1、js文件写法

export default function testFunciton(options){

//执行代码，注意代码中最后一般都需要return返回值

}

//ES6写法

const testFunction=(options)=>{

let x= ;

return x;

}

export default testFunction;

2、引入不需要花括号，只能一个个导入

import testFunction from ‘./util’; //方法名不需要加花括号

2.2 多个函数引入

---

1、js文件中写函数

多个函数的引入只能用export ，不能用export default

export function testFuncitonA(options){

//执行代码，注意代码中最后一般都需要return返回值

}

export function testFuncitonB(options){

//执行代码，注意代码中最后一般都需要return返回值

}

export function testFuncitonC(options){

//执行代码，注意代码中最后一般都需要return返回值

}

2、函数引入

import {testFunctionA,testFunctionB,testFunctionC,} from ‘./util’; //方法名需要加花括号

2.3 成组全部引入

---

1、引入方式

前端框架

前端框架太多了，真的学不动了，别慌，其实对于前端的三大马车，Angular、React、Vue 只要把其中一种框架学明白，底层原理实现，其他两个学起来不会很吃力，这也取决于你以后就职的公司要求你会哪一个框架了，当然，会的越多越好，但是往往每个人的时间是有限的，对于自学的学生，或者即将面试找工作的人，当然要选择一门框架深挖原理。

以 Vue 为例，我整理了如下的面试题。

如果你觉得对你有帮助，可以戳这里获取：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】