【解决子组件页面变动时不影响父组件的页面大小的边框】

解决子组件页面变动时不影响父组件的页面大小的边框
父组件采用dataV做边框
父组件使用自定义事件;@resize-border=“resizeBorder”
父组件:

<div class="content">
    <dv-border-box-13 ref="dv" :color="['#08B1E7']" :backgroundColor="'rgba(0,0,0,0.4)'">
        <el-tab-pane label="链路测量配置">
           <link-measurement-form style="margin-top: 30px" ref="measurement" @resize-border="resizeBorder"/>
        </el-tab-pane>
    </dv-border-box-13>
  </div>
自定义方法
resizeBorder() {
      this.$refs.dv.initWH()
      setTimeout(() => {
        this.$refs.dv.initWH()
      }, 20)
    },

子组件:
调用方法

// 表单移除配置框
    removeRule(index) {
      this.form.ioamConfList.splice(index, 1)
      this.$emit('resize-border')
    },

你可能感兴趣的:(vue,前端,javascript,html)