前端关于Vue的面试题（一）

1.vue组件传值几种方式

• 父组件通过prop向子组件传值

• 子组件通过this.$emit()触发父组组件传递过来的方法向父组件传值

• 兄弟组件之间不能直接传值，需要通过父组件来做间接传值，在这种情况下推荐使用vuex

• 中央事件总线

  //Bus.$emit 发送消息
  Bus.$emit('inceptMessage', this.msg)
  
  //Bus.$on  接收消息
  Bus.$on('inceptMessage',(msg) => {
  	this.fromComponentAMsg = msg
  })
  

具体例子请看官方文档

2.vue-router原理

说简单点，vue-router的原理就是监听URL地址变化，从而渲染不同的组件。

vue-router的模式主要有hash模式和history模式。

1.hash模式的原理(url带有#号部分)：
	在vue-router.js的2.8版本之前，在路由的hash部分发生了任何变化，都会执行window.onhashchange方法，在这个方法内部我们可以根据当前匹配到的hash去加载对应的组件
	在vue-router.js的2.8版本之后，内部使用window.history.pushState来完成相应的功能
	hash模式的特点：在切换路由的时候，不会向服务器发送请求，但是刷新网页的时候，
	此时会向服务器发送请求，在向服务器发送请求的时候，hash部分的信息是不会发送到服务器的，
	所以此时刷新网页没有问题

2.history模式的原理(url中通过/表示路径)
	内部使用window.history.pushState来处理url的变化，切换对应的组件
	history模式的特点：在切换路由的时候，不会向服务器发送请求，但是当刷新网页的时候，
	此时会向服务器发送请求，如果后端没有对应的接口与此匹配，此时会报资源找不到的错误
history模式一般情况下不能刷新网页

3.构建的 vue-cli 工程都到了哪些技术，它们的作用分别是什么？

1、vue.js：vue-cli工程的核心，主要特点是双向数据绑定和组件系统。
2、vue-router：vue官方推荐使用的路由框架。
3、vuex：专为 Vue.js 应用项目开发的状态管理器，主要用于维护vue组件间共用的一些 变量 和 方法。
4、axios（ 或者 fetch 、ajax ）：用于发起 GET 、或 POST 等 http请求，基于 Promise 设计。
5、vux  mint-UI  AntDesign  ElementUI等：为vue设计的UI组件库。
6、创建一个emit.js文件，用于vue事件机制的管理。
7、webpack：模块加载和vue-cli工程打包器。
8、AnimateCSS：动画库

4.vue.confog.js 的对于工程 开发环境 和 生产环境 的配置

  configureWebpack: config => {
    // 开发