vue面试题目

1，vue组件通信

（1）父子组件之间的通信

父-子：子组件中props参数，父组件中引入子组件，在子组件上面绑定所需的值

eg:

子组件中

父组件中

子-父：$emit+v-on方法，子组件中，绑定方法a,通过$emit触发父组件中的方法，顺便传参到父组件

eg:

子组件中、

showSearchModal方法就是在父组件中定义的

父组件中

（2）vuex，全局数据管理库进行通信

将状态保存在仓库中，通过mutation中定义的方法，commit来改变状态

eg:

改变状态

this.$store.commit("isQueryListFun", true);

获取状态

监听状态变化

（3）兄弟之间通信

1)  首先注册bus到vue原型上面

new Vue({
    router,
    i18n,
    store,
    render: h => h(App),
    beforeCreate() {
        Vue.prototype.bus = this;
    },
}).$mount('#app');

2）兄弟A+兄弟B

兄弟A传值：

this.bus.$emit("on-update-storage", {
                            storageQueryInfo: storageQueryInfo || [],
                            queryId: res.data.queryId,
                            replyDetailId: replyInfoList.length > 0 ? replyInfoList[replyInfoList.length - 1].queryDetailId : null
                        });

兄弟B接收：

  created() {
    this.bus.$on("on-update-storage", (data) => {
      this.formItem.queryStorageList = data.storageQueryInfo;
      this.queryId = data.queryId;
      this.replyDetailId = data.replyDetailId;
    }),
    this.bus.$on("on-update-storage-content", () => {
      this.formItem.queryContent = "";
    })
  },
  beforeDestroy() {
    this.bus.$off("on-update-storage");
    this.bus.$off("on-update-storage-content")
  }

2，mvvm

3、computed和watch的区别

（1）

（2）watch监听数据变化，一般在某个数据变化时做一些暑期，使用watch

4. vue的双向数据绑定

（1）Object.defineProperty劫持对象的访问器，在属性发生变化是，及时获取变化，然后响应

（2）

5.