Vue面试题你学会了吗

写在前面

CSDN话题挑战赛第1期

• 活动详情地址：https://marketing.csdn.net/p/bb5081d88a77db8d6ef45bb7b6ef3d7f

• 参赛话题：前端面试宝典

• 话题描述：欢迎各位加入话题创作得小伙伴，如果我没有猜错得话，我觉得你是应该同我一样是一位前端人。如今前端在IT事业中的占比越来越重，已经成为不可缺少的部分，前端技术也是层出不穷，各种技术类、技术框架也蜂拥而出，前端面试的难度也随之增加，如果我们拥有一套前端面试宝典。如果你是应聘者：你就可以从容的solo面试官，如果你是面试官：你就可以将应聘者拷问到骨子里！
  总之我们大家一起将自己的面试经验以及学习到的知识点汇聚于此，形成一套体系的前端面试宝典。让读者无论是面试还是学习都能够有非常大的收获。就让我们携手共筑前端面试宝典吧！！！

• 创作模板：

题目一

Vuex原理（简洁版）

👉考点

考察对Vuex原理的掌握

👉答案

Vuex实现了一个单向数据流，在全局拥有一个State存放数据，当组件要更改State中的数据时，
必须通过Mutation进行，Mutation同时提供了订阅者模式供外部插件调用获取State数据的更新。
而当所有异步操作(常见于调用后端接口异步获取更新数据)或批量的同步操作需要走Action，但Action也是无法直接修改State的，
还是需要通过Mutation来修改State的数据。最后，根据State的变化，渲染到视图上。

题目二

vue-router是怎样跳转路由的，怎样配置路由

👉考点

考察对配置路由的掌握

👉答案

配置路由(main.js)

3.1 创建组件 引入组件

import User from './components/User.vue'
3.2 定义路由(建议复制)

const routes = [
     {path:'/user',component:User},
     {path:'*',redirect:'/user'}  //默认跳转路由，匹配不到就跳转/user       
 ]
3.3 实例化 VueRouter(main.js)

      const router = new VueRouter({
           //mode: 'history',//配置后URL上的#会消失
           routes// (缩写) 相当于routers:routes
       })
3.4 挂载(main.js)

    new Vue({
             el:"#app",
             router,
             render:h=> h(App)           
     })
3.5 根组件的模板里边使用(组件中)

  <router-view></router-view>
3.6 路由跳转


   <router-link to="/user"> Go to User</router-link>
页面跳转：<router-link to="/user"> Go to User</router-link>
路由重定向： 重定向是通过 routes 配置来完成,记得关键字redirect即可

写在最后

CSDN话题挑战赛第1期

• 活动详情地址：https://marketing.csdn.net/p/bb5081d88a77db8d6ef45bb7b6ef3d7f