Vue

06-Frameworks-and-Components

发布日期: 2022-10-15

更新日期: 2022-10-17

文章字数: 117

阅读时长: 1 分

阅读次数:

VUE手动挂载节点

业务场景: 不想更改框架中的源码, 手动用新节点替换旧节点 $mount; 针对旧节点是在给定条件下展示, 使用watch去挂载

import i18n from '@/locales'

export const ZVueBusinessListPageMixin = {
  watch: {
    operatorList (newValue) {
      const importExcelUrl = `${this.dataConfig.sysVarietyView.servicePrefix || ''}/base/tool/public/importPlus/${this.currentViewId}?enableInsertOrUpdate=false`
      const MyImportExcelProgress = Vue.extend(ImportExcelProgress)
      let that = this
      if ((newValue || []).filter(item => item.buttonCode === 'disableImportOrUpdate').length) {
        that.$nextTick(() => {
          new MyImportExcelProgress({
            i18n: i18n,
            propsData: { importExcelUrl: importExcelUrl, buttonName: that.$t('导入不启用覆盖') }
          })
            .$mount('#ListButton-disableImportOrUpdate')
        })
      }
    }
  },
}