ThinkChat🤖让你学习和工作更高效,注册即送10W Token,即刻开启你的AI之旅 广告
> 1. Vue中常见的指令有哪些? * v-bind * v-on * v-if / v-else / v-else-if * v-show * v-model * v-for * v-once (只渲染一次) * v-text / v-html > 2. Vue中常见的修饰符有哪些? * .stop (阻止事件冒泡) * .prevent (阻止默认事件) * .self (只有当前标签才可以触发此事件) * .once (这个事件只执行一次) * .sync (可以更新props执行的父级变量) * .number (把数据直接格式化成number类型赋予给变量) * .lazy (当失去焦点才绑定数据) * .trim (去除两边的空格)(不会去掉中间的空格) * .capture (事件捕获阶段 ,触发此事件). * .passive (1. 提高移动端滚动效率(实时触发), 2. 内置了prevent, 不要再调用了) > 3. $nextTick()的作用? 在下次 DOM 更新循环结束之后执行延迟回调 $nextTick要放入回调函数 > 4. axios是什么? 怎么用? Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中 (1): npm 下载axios模块 (2):二次封装axios 全局网络请求工具, 配置不同的域名请求 (3): 统一的接口管理文件, 所有的请求都在那里配置. > 5. MVVM是什么, 说说你的理解? 它是由MVC设计模式演变过来的一套设计模式,它将视图UI与业务逻辑分开, 使用View-Model层把View和Model绑定在了一起, 互相影响, Vue就是采用MVVM的设计模式 > 6. Vue和JQuery的区别? 使用场景? Vue: 靠数据驱动视图, 基本上无需获取DOM和设置DOM. JQuery: 获取DOM节点, 操作节点/和数据 使用场景: 数据变化比较多的时候(Vue), DOM节点操作比较多(JQuery) > 7. Vue生命周期图解? ![](https://box.kancloud.cn/6f2c97f045ba988851b02056c01c8d62_1200x3039.png) >8. vue如何监听键盘事件中的按键? @keyup/@keydown 后面还可以指定某一个按键才会触发事件 修饰符: * `.enter` * `.tab` * `.delete`(捕获“删除”和“退格”键) * `.esc` * `.space` * `.up` * `.down` * `.left` * `.right` Vue2.1.0 + * `.ctrl` * `.alt` * `.shift` * `.meta` > 9.vue-router有哪几种导航守卫? router.beforeEach (路由改变之前触发) router.beforeResolve(全局的和组件内的守卫都执行完毕, 最后再执行这个) router.afterEach (守卫之后, 路由改变完成触发) 组件内守卫: (当前组件身上的守卫) * `beforeRouteEnter` (当前组件将要被路由加载前的一刻触发, 不能获取this, 因为组件DOM还没被加载) * `beforeRouteUpdate`(2.2 新增) (该组件被复用时调用) * `beforeRouteLeave` (导航路由离开该组件时触发) > 10. vue-router实现路由懒加载( 动态加载路由 ) 懒加载的使用场景:Vue打 包会变得非常大,影响页面加载速度。当路由被访问的时候才加载对应组件,这样就更加高效了。 懒加载步骤: (1): 使用异步组件技术: (例: component: resolve => require(\['@/components/home'\],resolve) (2): () => import('@/views/nested/menu1/menu1-2/menu1-2-1') 动态路由方案: (1), 合并路由的配置项, (注意, 要使用异步加载) (2): router.addRoutes(), 一般应用场景在不同用户给与不同的路由列表 > 11.Vuex在Vue-cli中的应用? Vuex: 全局状态管理, 它是Vue官方推荐使用, 内部有主要state/mutations/actions/getters/modules, Store只能有一个 使用步骤: (1) 下载 (2) 引入并且配置 (3) main.js中注入全局store 使用场景: 当跨组件传值/跨页面传值/需要保存在全局的逻辑变量 > 12. Vue之间的传值方式? 页面-页面 (跳转传参, 路由的路径, path配合query, name配合parmas) 组件-组件 (父->子用props, 子->父 自定义事件, 跨组件 EventBus/Vuex) 还可以使用refs来直接操作子组件 > 13.Vue的双向数据绑定的原理? 使用数据观察+劫持+订阅观察者模式, 配合Object.defineProperty来监听每个属性的变化, 同时更新DOM标签 > 14. 请说出vue.cli项目中src目录每个文件夹和文件的用法? * api ---- 接口管理封装 * assets --- 打包的静态资源 * components --- 复用的组件封装 * icons ---- 字体图标文件 * router ---- 路由配置 * store ---- Vuex的配置 * style ---- 全局样式 * utils --- 工具包 * pages/views --- 页面组件 * directives --- 全局指令 * filters ---- 全局过滤器 * vertical --- 全局验证类 main.js --- 项目配置入口 App.Vue --- 根组件 > 15. 为什么虚拟DOM会提高性能? * 虚拟DOM其实就是一个JavaScript对象, 原理: createDocumentFragment() * 在数据更新时, 只更新部分DOM结构 * 减少实际DOM的操作次数 >16. 如何封装一个组件, 谈谈你的思路?