情境：对关联商品禁用显示tips提示

<div class="appBody">
    <el-tooltip class="item" effect="dark" content="没有点击的权限" placement="top">
      <el-button type="primary" disabled>同意</el-button>
    </el-tooltip>
    <el-button type="primary">驳回</el-button>
  </div>

效果如下

解决办法

想要达到禁用的按钮鼠标经过时出现tips提示,在button外面再套一层标签，tooltip包裹里的第一级是谁，那么tips就是加给谁的，所以我们把tips加给button的外层，那个按钮的禁用disabled只会影响按钮而不会影响其他元素。

  <el-tooltip effect="dark" content="没有点击的权限" placement="top">
                                <div class="relevance-pack-wrap">
                                    <div class="relevance-pack" :class="{'not-click-pack':!goodManageForm.brandId || see}">
                                        <div>
                                            <span @click="packAddRelated(false)" :style="{ color: (!goodManageForm.recyclePackageId ? '#c0c4cc' : '') }">
                                                {{
                                                packAlreadySelectTableData.length
                                                ? packAlreadySelectTableData[0].productName : '请选择' }}
                                            </span>
                                            <i class="input-suffix" style="color: #d0cdcf;" :class="goodManageForm.recyclePackageId ? 'el-icon-circle-close' : 'el-icon-arrow-down'" @click="packSelectArrowOrDel(false)"></i>
                                        </div>
                                    </div>
                                    <el-checkbox :disabled="controlDisabled" v-model="goodManageForm.recycled">
                                        需回收{{ packageAlias
                                        }}
                                    </el-checkbox>
                                </div>
                            </el-tooltip>