问题： element 封装dialog弹窗组件鼠标移动到弹窗出现title

封装的组件

<template>
    <el-dialog 
    title="111"
     v-bind="$attrs" 
    v-on="$listeners" 
    :visible.sync="show" 
    >
    </el-dialog>
</template>

<script>
export default {
  name: 'ZlDialog',
  data () {
    return {
      modals: true
    };
  },
  props: {
    show: { // 是否显示dailog
      type: Boolean,
      required: true,
      default: false
    }
    
  },
};
</script>

使用

<zl-dialog title="选择批号22" v-if="show"  :show.sync="show" width="1200px" @submit="submit">
    <div>
        <li>1</li>
    </div>
    <template #footer>
      <span  style="margin-right:10px">
          <el-button type="primary" size="small">暂存</el-button>
          <el-button type="primary" size="small">暂存</el-button>
          <el-button type="primary" size="small">暂存</el-button>
          <el-button type="primary" size="small">暂存</el-button>
      </span>
    </template>
    
</zl-dialog>

问题排查
其实通过f12查找元素可以发现一个问题

div上挂了一个title，因为封装组件处理参数使用了 v-bind=“$attrs”
单独将title写在props里 看下效果 完美解决