Vue之呼吸

Nick Chen

Follow

3 min readMay 13, 2020

--

前言

在大型公司，產品、團隊共用元件管理、開發的議題一直存在…
下面簡單的介紹，從2019/05開始
我們團隊所努力的成果！

壹之型

跨產品、團隊共用Component原件

重點在這！

完成！

貳之型

單頁重覆使用元件＆傳送資料進元件內部使用

記得加上 props

props: {
  nameSpace: VueTypes.string.def('')
},

完成！

參之型

開放 function 讓外部呼叫使用

我們用 eventBus 來操作

data: function() {
  return {
    safetyPopup: {
      isShow: false
    }
  };
},
mounted() {
  this.$eventBus.$on("toggleSafetyPopup", this.toggleSafetyPopup);
},
destroyed() {
  this.$eventBus.$off("toggleSafetyPopup");
},
methods: {
  closeSafetyPopup: function() {
    this.safetyPopup.isShow = false;
  },
  toggleSafetyPopup: function(status) {
    this.safetyPopup.isShow = status;
  }
}