2，實(shí)現(xiàn)一個(gè)不知道寬高的盒子水平垂直居中，有哪幾種實(shí)現(xiàn)方式：
a) 使用CSS方法：
父盒子設(shè)置：display:table-cell;text-align:center;vertical-align:middle;
子盒子設(shè)置：display:inline-block;vertical-align:middle;
代碼實(shí)現(xiàn)：=>
.father{
width:300px;
height:300px;
display:table-cell;
text-align:center;
vertical-align:center;
}
.son{
background:red;
display:inline-block;
vertical-align:middle;
}
b) 使用CSS3 transform:
父盒子設(shè)置：position:relative;
子盒子設(shè)置：position:absolute;left:50%;top:50%;transform：transform(-50%,-50%);
代碼實(shí)現(xiàn)：=>
.father{
width:300px;
height:300px;
position:relative;
}
.son{
background:red;
position:absolute;
top:50%;
left:50%;
transform:transform(-50%,-50%);
}
c) 彈性盒子：
父盒子設(shè)置：display:flex;justify-content:center;align-item:center;
子盒子設(shè)置：空，不需要設(shè)置
代碼實(shí)現(xiàn)：=>
.father{
width:300px;
height:300px;
display:flex;
justify-content:center;
align-item:center;
}
.son{
background:red;
}
[參考]([https://zhuanlan.zhihu.com/p/27186791][1])
3，如何用css畫一個(gè)三角形：
代碼實(shí)現(xiàn)：=>
#eg{
width: 0;
height: 0;
border: 100px solid transparent;
border-bottom: 100px solid blue;
}
二，JS部分：
1，請(qǐng)寫一段代碼將"2019-4-28"轉(zhuǎn)成"2019年4月28日"
代碼實(shí)現(xiàn)：=>
let str = "2019-4-28";
let year = str.split("-")[0];
let month = str.split("-")[1];
let date = str.split("-")[2];
let str1 =year+"年"+month+"月"+date+"日";
console.log(str1);
2，寫一段代碼將數(shù)組 ["a","b","c"] , 變成 ["c","b","a"] 。(可使用js自帶方法，也可以自己實(shí)現(xiàn))
代碼實(shí)現(xiàn)：=>
var arr=["a","b","c"];
//var arr1=arr.sort();//正序
var arr1=arr.reverse();//反序
console.log(arr1);
三，Vue部分：
1，vue的生命周期鉤子函數(shù)有哪些？
answer:=>
beforeCreate
created
beforeMount
mounted
beforeUpdate
updated
activated
deactivated
beforeDestroy
destroyed
[詳細(xì)]([https://www.cnblogs.com/xkloveme/p/7435271.html][2])
2，什么是keep-alive？它有什么作用？與他對(duì)應(yīng)的鉤子函數(shù)是那些？
answer:=>
是Vue的內(nèi)置組件，能在組件切換過程中將狀態(tài)保留在內(nèi)存中，防止重復(fù)渲染DOM。
對(duì)應(yīng)的鉤子函數(shù)：
activated
類型：func
觸發(fā)時(shí)機(jī)：keep-alive組件激活時(shí)使用；
deactivated
類型：func
觸發(fā)時(shí)機(jī)：keep-alive組件停用時(shí)調(diào)用；
3，vue的事件修飾符是什么，她能做什么事？舉個(gè)栗子：在vue的click事件中，如何阻止事件傳播？
answer:=>
事件修飾符處理了許多DOM事件的細(xì)節(jié)，讓我們不再需要花大量的時(shí)間去處理這些煩惱的事情，
而能有更多的精力專注于程序的邏輯處理。在Vue中事件修飾符主要有：
.stop：等同于JavaScript中的event.stopPropagation()，防止事件冒泡
.prevent：等同于JavaScript中的event.preventDefault()，防止執(zhí)行預(yù)設(shè)的行為
（如果事件可取消，則取消該事件，而不停止事件的進(jìn)一步傳播）
.capture：與事件冒泡的方向相反，事件捕獲由外到內(nèi)
.self：只會(huì)觸發(fā)自己范圍內(nèi)的事件，不包含子元素
.once：只會(huì)觸發(fā)一次
舉個(gè)栗子：=>
.stop 防止事件冒泡
冒泡事件：嵌套兩三層父子關(guān)系，然后所有都有點(diǎn)擊事件，點(diǎn)擊子節(jié)點(diǎn)，就會(huì)觸發(fā)從內(nèi)至外
子節(jié)點(diǎn)-父節(jié)點(diǎn)的點(diǎn)擊事件
4，什么是vue router路由導(dǎo)航守衛(wèi)？工作中用過她嗎？常用她處理什么問題？
導(dǎo)航守衛(wèi)即是在路由跳轉(zhuǎn)的時(shí)候，根據(jù)vue-router提供的導(dǎo)航守衛(wèi)主要用來通過跳轉(zhuǎn)或取消參數(shù)
或查詢的改變并不會(huì)出觸發(fā)進(jìn)入/離開的導(dǎo)航守衛(wèi)
路由跳轉(zhuǎn)前做一些驗(yàn)證，比如登錄驗(yàn)證，是網(wǎng)站中的普遍需求。
對(duì)此，vue-route 提供的 beforeRouteUpdate 可以方便地實(shí)現(xiàn)導(dǎo)航守衛(wèi)（navigation-guards）。
5，從路由/user跳轉(zhuǎn)到/home,有幾種方式？
1.router-link
2.this.$router.push() (函數(shù)里面調(diào)用)
3.this.$router.replace() (用法同上,push)
4.this.$router.go(n) ()
[詳細(xì)介紹]([https://blog.csdn.net/jiandan1127/article/details/86170336][3])
6，什么是vuex？他有什么作用？如何改變store中的狀態(tài)（state）？
answer:=>
vuex是一個(gè)專為vue.js應(yīng)用程序開發(fā)的狀態(tài)管理模式。vuex解決了組件之間同一狀態(tài)的共享問題。
當(dāng)我們的應(yīng)用遇到多個(gè)組件之間的共享問題時(shí)會(huì)需要
狀態(tài)管理核心狀態(tài)管理有5個(gè)核心，分別是state、getter、mutation、action以及module。
1.state
state為單一狀態(tài)樹，在state中需要定義我們所需要管理的數(shù)組、對(duì)象、字符串等等，只有在這里定義了，
在vue.js的組件中才能獲取你定義的這個(gè)對(duì)象的狀態(tài)。
2.簡(jiǎn)單的 store 模式
var store = {
debug: true,
state: {
message: "Hello!"
},
setMessageAction (newValue) {
if (this.debug)
console.log("setMessageAction triggered with", newValue)
this.state.message = newValue
},
clearMessageAction () {
if (this.debug) console.log("clearMessageAction triggered") this.state.message = ""
}
}
所有 store 中 state 的改變，都放置在 store 自身的 action 中去管理。
這種集中式狀態(tài)管理能夠被更容易地理解哪種類型的 mutation 將會(huì)發(fā)生，以及它們是如何被觸發(fā)。
當(dāng)錯(cuò)誤出現(xiàn)時(shí)，我們現(xiàn)在也會(huì)有一個(gè) log 記錄 bug 之前發(fā)生了什么。
此外，每個(gè)實(shí)例/組件仍然可以擁有和管理自己的私有狀態(tài)：
var vmA = new Vue({
data: {
privateState: {},
sharedState: store.state
}
})
var vmB = new Vue({
data: {
privateState: {},
sharedState: store.state
}
})
End!
