vue面试题(五)

面试题

vue中key值的作用？

在v-for时使用，标识组件的唯一性，更好的区分组件，高效的更新虚拟DOM

watch和computed的区别？

Watch只能监听data中的数据变化，computed不需要，watch可以进行异步操作，computed不可以，computed不修改原始数据，通过return返回处理的数据，可以包含大量的逻辑运算

对于vue是一套渐进式框架的理解？

渐进式代表的含义是：主张最少。 Vue可能有些方面是不如React，不如Angular，但它是渐进的，没有强主张，你可以在原有大系统的上面，把一两个组件改用它实现，当jQuery用；也可以整个用它全家桶开发，当Angular用；还可以用它的视图，搭配你自己设计的整个下层用。你可以在底层数据逻辑的地方用OO和设计模式的那套理念，也可以函数式，都可以，它只是个轻量视图而已，只做了自己该做的事，没有做不该做的事，仅此而已。

如何解决axios中的post提交参数不解析的问题？

关于post提交参数的问题 问题描述：post提交参数需要提交的数据形式需要为一个字符串 形如：a=b&c=d。我们平时开发习惯于传入对象，所以需要将对象进行处理。切记：不可以直接提交对象 如何处理？- 方法1：通过for in 将对象转化为 字符串 - 方法2：URLSearchParams - 方法3：qs库

axios的基础方法有哪些？

axios.get(请求地址，配置对象).then(res=>{ res就是相应的数据 }) axios.post(请求地址，请求数据，配置对象).then(res=>{ … }) axios.create(配置对象) axios.all([请求1，请求2]).then(res=>{ res是一个数组。数组的值就是每个请求返回的数据信息 }) axios({ 配置信息 })

vuex的核心概念有哪些，分别表示什么含义？

state 共享的数据，类似于data getters 对state的数据进行处理， 类似computed mutations 对state数据进行修改 actions 触发mutations 对数据进行修改 module 分模块管理数据

路由同组件跳转，组件将不会更新，如何解决这个问题？

• 方法1：利用watch监听$route的变化 - 方法2：利用路由局部钩子 beforeRouteUpdate 只要路由更新就调用

vue中哪些方法可以实现页面之间传参，且如何获取到值？

1、search传参 this.$route.query.属性名2、动态路由path:"/地址/变量名"<router-linkto="/地址/数据值"></router-link>this.$route.params.变量名 3、本地存储 setItem() getItem()

vue-router 基本使用步骤？

第1步：引入vue.js 再引入vue-router.js、  vue-router需要引入在vue之后
<script src="vue.js"></script>
<script src="vue-router.js"></script>
第2步：设置路由组件
let 组件配置变量 ={
  template:"#模板id",
    data(){
      return{}
    }
    ...
}
第3步：建立映射关系
let routes = [
{
      path:"/地址",
      component:组件配置变量
    },
    {
      path:"/地址/:id",    // 动态路由
      component:组件配置变量
    },
  {
      path:"/地址",
      components:{
        default:组件配置变量      // <router-view name="default"/>
        视图的名称:组件配置变量    // <router-view name="视图名称"/>
      }
    },
    {
      path:"/地址",   // 访问地址的时候回去访问地址2
      component:组件配置变量,
      redirect:"/地址2"   
    },
  {
      path:"/地址",    
      component:组件配置变量A,
      children:[
        {
          path:"地址2",    
       // 访问  /地址/地址2  
           //就渲染  组件配置变量 会渲染在组件配置变量A模板里面router-view里面
          component:组件配置变量
        }
      ]
    }
 
]
第4步：实例化路由对象
let router = new VueRouter({
  // routes:routes    // routes 简写
  routes，
          linkActiveClass:"active",
          mode:"hash/history"
})
第5步：挂载到Vue实例
new Vue({
el:"",
data:{},
// router:router  // 简写
router
})
第6步：书写router-view
<div  id="app">
  <router-view/>
</div>
第7步：使用router-link 进行跳转
<router-link to="/地址">
// 酌情给分

请说明在vue中组件之间如何进行数据传递？

1.父子组件 在子组件的标签上定义一个变量，：变量=‘传的值’，在子级中使用props接收变量 2.子父组件 在子组件中写一个事件，事件中使用this.$emit(‘自定义事件名’，’数据’)；在父级中的子标签上使用@自定义事件=‘父级事件’来接收3.兄弟组件创建一个新的vue实例vartrans=newVue()在组件一中：trans.$on(‘事件’，（n）=>{console.log(n) }) 在组件二中：trans.$emit(‘事件’，’发送的数据’)（写在2的事件中）