技术标签： 前端 vue.js javascript
生命周期函数面试题
1.什么是Vue生命周期？
vue生命周期是指vue是对象从创建到销毁的过程。
2.Vue生命周期的作用是什么？
在vue生命周期的不同阶段通过对应的钩子函数来实现组件数据管理和DOM渲染两大重要功能。
创建阶段：beforecreate：实例已经初始化，但不能获取DOM节点。(没有data，没有el)created:实例已经创建，仍然不能获取DOM节点。(有data，没有el)
载入阶段：beforemount：模板编译完成，但还没挂载到界面上。(有data，有el)mounted：编译好的模板已挂载到页面中(数据和DOM都已经渲染出来)。
更新阶段：beforeupdate：数据发生变化立即调用，此时data中数据是最新的，但页面上数据仍然是旧的(检测到数据更新时，但DOM更新前执行)。updated：更新结束后执行，此时data中的值和页面上的值都是最新的。
销毁阶段：beforedestroy：当要销毁vue实例时，在销毁之前执行。destroy：在销毁vue实例时执行。
3.第一次页面加载会触发哪几个钩子函数？
beforeCreate,created,beforeMount,mounted。
4.简述每个生命周期具体适合哪些场景？
beforecreate：可以加Loading事件。create：初始化完成时的事件写在这里，异步请求也适宜在这里调用（请求不宜过多，避免白屏时间太长）。
可以在这里结束loading事件，还做一些初始化，或实现函数的自执行。
此时未挂载DOM，若在此阶段进行DOM操作一定要放在Vue.nextTick()的回调函数中。mounted：此时完成挂载DOM和渲染，需要操作DOM的方法可以放在这里，也可在这发起后端请求，拿回数据，配合路由钩子做一些事情。beforeupdate：可在更新前访问现有的DOM，如手动移出添加的事件监听器。updated:组件DOM已完成更新，可执行依赖的DOM操作。
注意：不要在此函数中操作数据（修改属性），会陷入死循环。activated：在使用vue-router时有时需要使用<keep-alive></keep-alive>来缓存组件状态，这个时候created钩子就不会被重复调用了。
如果我们的子组件需要在每次加载的时候进行某些操作，可以使用activated钩子触发。
deactivated：<keep-alive></keep-alive>组件被移除时使用。beforedestroy：销毁前，可以做一些删除提示，如：您确定删除xx吗？destroy：销毁后，这时组件已经没有了，无法操作里面的任何东西了。
5.created和mounted的区别？
created:实例已经创建，但不能获取DOM节点。mounted：模板已经挂载到页面上，可以操作DOM元素。
6.vue组件间通信六种方式
组件之间的传值通信
组件之间通讯分为三种: 父传子、子传父、兄弟组件之间的通讯;
(1)props/$emit
- 父传子：
props- 子传父：父组件向子组件传递事件方法，子组件通过
$emit触发事件，回调给父组件(2)
$eimt/$on
- 这种方法通过一个空的Vue实例作为中央事件总线（事件中心），用它来触发事件和监听事件,巧妙而轻量地实现了任何组件间的通信，包括父子、兄弟、跨级。
具体实现方式：var Event=new Vue(); Event.$emit(事件名,数据); Event.$on(事件名,data => {}); // 假设兄弟组件有三个，分别是A、B、C组件，C组件如何获取A或者B组件的数据 // 组件A、B通过Event.$emit(事件名,数据)将数据传递，组件C通过 Event.$on(事件名,data => {})接受组件A、B传递的数据(3)
Vuex
- vuex 就是一个仓库，仓库里放了很多对象。在state中存放数据源，当组件要更改state中的数据时，必须通过mutation进行，mutation储存的是改变state中数据的操作方法，之后通过actions储存的操作去触发mutation中的方法,由组件中的$store.dispatch('action 名称', data1)来触发。然后由commit()来触发mutation的调用 , 间接更新 state。
(4)
Vuex + localstorage
- vuex 是 vue 的状态管理器，存储的数据是响应式的。但是并不会保存起来，刷新之后就回到了初始状态，具体做法应该在vuex里数据改变的时候把数据拷贝一份保存到localStorage里面，刷新之后，如果localStorage里有保存的数据，取出来再替换store里的state。
- 这里需要注意的是：由于vuex里，我们保存的状态，都是数组，而localStorage只支持字符串，所以需要用JSON转换。
(5)
$attrs/$listeners
- $attrs:包含了父作用域中不作为 prop 被识别 (且获取) 的 attribute 绑定 (class 和 style 除外)。当一个组件没有声明任何 prop 时，这里会包含所有父作用域的绑定 (class 和 style 除外)，并且可以通过 v-bind="
$attrs" 传入内部组件——在创建高级别的组件时非常有用。- $listeners:包含了父作用域中的 (不含 .native 修饰器的) v-on 事件监听器。它可以通过 v-on="
$listeners" 传入内部组件——在创建更高层次的组件时非常有用。(6)
provide/inject
- provide/inject:vue2.2.0 新增API,以允许一个祖先组件向其所有子孙后代注入一个依赖，不论组件层次有多深，并在起上下游关系成立的时间里始终生效。
- 总而言之：祖先组件中通过provider来提供变量，然后在子孙组件中通过inject来注入变量。
provide /
前言本篇文章主要记录分享我的面试准备过程。很多朋友问我为什么离职关于离职原因，马云有一句经典的话“要么钱没给到位，要么心委屈了”，想必大家耳熟能详了，我这里再细说一下我个人离职原因：工资倒挂，涨薪不如意在之前的小厂薪资倒挂现象严重，新入职的员工工资明显高过老员工，企业宁愿高薪招聘一位新员工，也不愿给我们老员工加工资，这让老员工十分寒心。接地造成老员工离职。继而还有一种，当感觉自己的劳动并未收获到相应的价值之时，继续在原公司呆下去意义也不大。十年如一日的技术在小型软件公司干的三年时间里，其实只拥_安卓 离职原因
利用Blob对象进行文件的下载例子（此例子是在vue中执行的，其他环境需注意方法的调用）：base64格式文件let docbase64 = 'data:application/octet-stream;base64,0M8R4KGxGuEgCAIAAAAAAMAAAAAAAABGPgADAP7/CQAGAAAAAAAAAAAAAAABAAAAJQAAAAAAAAAAEAAAJAAAAAEAAAD+////AAAAACcAAAD/////////////////////////////////////_ataapplication/force-downloadbase64uesdbbqacagiabz1micaaaaaaa
win + Q 搜索win + U 辅助功能win + I 系统设置win + P 投影win + A 状态栏win + 数字 对应的应用ALT 双击鼠标 查看属性_win10虚拟机快捷键
Ubuntu 14.04 Desktop安装完之后发现网络一直无法连接。搜了很多资料后发现可能是驱动的问题。 网卡型号：Ethernet controller: Realtek Semiconductor Co., Ltd. RTL8111/8168/8411 PCI Express Gigabit Ethernet Controller (rev 06)但是系统默认安装的是r8169..._37d1网卡驱动
大家好，我是Tom哥~，今天跟大家聊聊SQL性能优化，具有很强的工作实用性。前言sql优化是一个大家都比较关注的热门话题，无论你在面试，还是工作中，都很有可能会遇到。如果某天你负责的某个线上接口，出现了性能问题，需要做优化。那么你首先想到的很有可能是优化sql语句，因为它的改造成本相对于代码来说也要小得多。那么，如何优化sql语句呢？这篇文章从15个方面，分享了sql优化的一些小技巧，希望对你有所帮助。1 避免使用select *很多时候，我们写sql语句时，为了方便，喜欢直接使用sele_sql性能优化
el-table显示滚动条，但表头固定（解决方法）_el-table表头固定,不随滚动条而动
1.获取请求行信息的相关方法当访问Servlet时，会在请求消息的请求行中包含请求方法、请求资源名、请求路径等信息。HttpServletRequest接口中获取请求行的相关方法：方法声明功能描述String getMethod()该方法用于获取HTTP请求消息中的请求方式（如GET、POST等）String getReauestURI()该方法用于获取请求行中资源名称部分，即位于URL的主机和端口之后、参数部分之前的部分String getQueryString(_httpservletrequest.getmethod
该楼层疑似违规已被系统折叠隐藏此楼查看此楼function [ t ] = solution( x )%UNTITLED2 此处显示有关此函数的摘要% 此处显示详细说明global tl Wturb UAj=0;i=tl+1;%为各个参数数组预制内存Etz=(i:1:x);Ewnet=ones(size(Etz));EUA=zeros(size(Etz));i=i-1;while ii..._试图访问 b(1);由于 numel(b)=0,索引超出范围。
4、用手机在设置->wifi连接-->连接ESP32-EYE-XXX热点（ESP32-EYE处于soft AP模式），然后在浏览器输入192.168.1.4/face_stream，即可以看到摄像头上的图像。下一步在window上采用WSL，开始搭建ESP-WHO/ESP-IDF开发环境，进入开发环节！5、可以点击开发板侧面的按键，触发人脸检测人脸录入！录入成功后，即可体验人脸识别功能。3、上电，用串口调试助手 115200 8N1连接，可以体验出厂板上默认的固件。2、开发板+说明卡片。
前言 之前对这部分的内容了解很少，这次重要参考MTK官网文档《MTK_Camera_Memory_Introduction_and_Debug.pdf》，结合项目上的一些log来进行学习。后续有遇到类似的问题，会在这里继续补充一、Camera RAM Memory Overiew 1.1 Android RAM Memory Layout从 camera 角度理解 total RAM，分为 Free(剩余 memory)，Others(非 camera 模块)，Camera ..._total ram
在表中，可能会包含重复值。这并不成问题，不过，有时您也许希望仅仅列出不同（distinct）的值。关键词 distinct用于返回唯一不同的值。表A：示例1select distinct name from A执行后结果如下：示例2select distinct name, id from A执行后结果如下：实际上是根据“name_distinct sql用法会返回那一条
JUnit相信把JUnit作为排名第一，没有问题。JUnit相信在很长的时间中仍然是最受欢迎最常见的测试框架。就其单元测试，对于很多项目是必不可少的一部分。自然而知，也必然会成为最热门的测试库。Log4jLog4j是Apache中的一个开源日志库。可以扩展到支持自定义组件配置。配置语法也非常简单，支持XML,YAML和JSON.并提供了对多个API的支持，而且其在速度也极为可观。Googl..._java开发库