一，css部份

1，简朴引见下css权重优先级：

    默许款式<标签选择器<类选择器<id选择器<行内款式<!important
      0         1        10      100    1000    1000以上
    继续的权重为0  (字体的css会继续自父类标签元素)
    权重会叠加     (div.box  权重:1+10=11)  (div #box  权重:1+100=101) 
    雷同权重的选择器，后边的代码会掩盖前面的
    

2，完成一个不知道宽高的盒子程度垂直居中，有哪几种完成体式格局：

    a) 运用CSS要领：
    父盒子设置：display:table-cell;text-align:center;vertical-align:middle;
    子盒子设置：display:inline-block;vertical-align:middle;
    代码完成：=>
        .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:
    父盒子设置：position:relative;
    子盒子设置：position:absolute;left:50%;top:50%;transform：transform(-50%,-50%);
    代码完成：=>
        .father{
            width:300px;
            height:300px;
            position:relative;
        }
        .son{
            background:red;
            position:absolute;
            top:50%;
            left:50%;
            transform:transform(-50%,-50%);
        }
        
    c) 弹性盒子：
    父盒子设置：display:flex;justify-content:center;align-item:center;
    子盒子设置：空，不须要设置
    代码完成：=>
        .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画一个三角形：

    代码完成：=>
    #eg{
    width: 0;
    height: 0;
    border: 100px solid transparent;
    border-bottom: 100px solid blue;
    }

二，JS部份：

1，请写一段代码将”2019-4-28″转成”2019年4月28日”

    代码完成：=>
    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，写一段代码将数组 [‘a’,’b’,’c’] , 变成 [‘c’,’b’,’a’] 。(可运用js自带要领，也可以本身完成)

    代码完成：=>
    var arr=['a','b','c'];
    //var arr1=arr.sort();//正序
    var arr1=arr.reverse();//反序
    console.log(arr1);
    

三，Vue部份：

1，vue的生命周期钩子函数有哪些？

    answer:=>
        beforeCreate
        created
        beforeMount
        mounted
        beforeUpdate
        updated
        activated
        deactivated
        beforeDestroy
        destroyed
    [细致]([https://www.cnblogs.com/xkloveme/p/7435271.html][2])
    

2，什么是keep-alive？它有什么作用？与他对应的钩子函数是那些？

    answer:=>
        是Vue的内置组件，能在组件切换过程中将状况保留在内存中，防备反复衬着DOM。
        对应的钩子函数：
        activated
            范例：func
            触发机遇：keep-alive组件激活时运用；
        deactivated
            范例：func
            触发机遇：keep-alive组件停用时挪用；
            

3，vue的事宜修饰符是什么，她能做什么事？举个栗子：在vue的click事宜中，怎样阻挠事宜流传？

    answer:=>
        事宜修饰符处置惩罚了很多DOM事宜的细节，让我们不再须要花大批的时刻去处置惩罚这些懊恼的事变，
        而能有更多的精神专注于顺序的逻辑处置惩罚。在Vue中事宜修饰符重要有：                
        .stop：等同于JavaScript中的event.stopPropagation()，防备事宜冒泡
        .prevent：等同于JavaScript中的event.preventDefault()，防备实行预设的行动
        （假如事宜可作废，则作废该事宜，而不住手事宜的进一步流传）
        .capture：与事宜冒泡的方向相反，事宜捕捉由外到内
        .self：只会触发本身范围内的事宜，不包括子元素
        .once：只会触发一次
    举个栗子：=>
        .stop 防备事宜冒泡
        冒泡事宜：嵌套两三层父子关系，然后一切都有点击事宜，点击子节点，就会触发从内至外  
        子节点-父节点的点击事宜
        

4，什么是vue router路由导航守御？工作中用过她吗？经常使用她处置惩罚什么题目？

    导航守御等于在路由跳转的时刻，依据vue-router供应的导航守御重要用来经由过程跳转或作废参数
    或查询的转变并不会出触发进入/脱离的导航守御
    
    路由跳转前做一些考证，比方登录考证，是网站中的广泛需求。
    对此，vue-route 供应的 beforeRouteUpdate 可以方便地完成导航守御（navigation-guards）。
    

5，从路由/user跳转到/home,有几种体式格局？

    1.router-link
    2.this.$router.push() (函数内里挪用)
    3.this.$router.replace() (用法同上,push)
    4.this.$router.go(n) ()
 [细致引见]([https://blog.csdn.net/jiandan1127/article/details/86170336][3])
 

6，什么是vuex？他有什么作用？怎样转变store中的状况（state）？

    answer:=>
        vuex是一个专为vue.js运用顺序开辟的状况治理形式。vuex处理了组件之间统一状况的同享题目。
        当我们的运用碰到多个组件之间的同享题目时会须要
        状况治理中心状况治理有5个中心，分别是state、getter、mutation、action以及module。
    1.state
        state为单一状况树，在state中须要定义我们所须要治理的数组、对象、字符串等等，只要在这里定义了，
        在vue.js的组件中才猎取你定义的这个对象的状况。
    2.简朴的 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 中去治理。
     这类集中式状况治理可以被更轻易地明白哪一种范例的 mutation 将会发作，以及它们是怎样被触发。
     当毛病出现时，我们如今也会有一个 log 纪录 bug 之前发作了什么。
     
     另外，每一个实例/组件依然可以具有和治理本身的私有状况：
     var vmA = new Vue({ 
         data: { 
         privateState: {}, 
         sharedState: store.state 
         } 
     }) 
     var vmB = new Vue({ 
         data: { 
         privateState: {}, 
         sharedState: store.state 
         } 
     })
     
     End!