项目场景：

表格内操作按钮点击后，刷新列表更新按钮显示状态

问题描述

`点击更新状态后的那条数据操作按钮。
发现element-ui的el-popover无法点击唤出弹窗，但刷新页面就可以正常点击进行操作。即el-popover刷新列表后无法点击

---

原因分析：

 <el-popover
                  :ref="`node-popover-adjust-download-${missions.id}`"
                  placement="right"
                  v-model="missions.isVisible"
                >
                  <p
                    v-if="!!missions.publishDep"
                    @click="
                      handleDownload(missions);
                      missions.isVisible = false;
                    "
                    style="color:var(--mainColor);cursor: pointer;"
                  >
                    下载风险提示函反馈单
                  </p>
                  <p
                    style="color:var(--mainColor);cursor: pointer;"
                    @click="
                      downNow(missions);
                      missions.isVisible = false;
                    "
                  >
                    下载风险事前评估表
                  </p>
                  <!-- 已提交已整改加有附件就可以下载 -->
                  <span
                    v-if="
                      missions.attachmentType === 1 &&
                        (!getSubmitStatus(missions) ||
                          (loginUl.depType === 1 && loginUl.orgId === 7))
                    "
                    style="pointer-events: auto;"
                    slot="reference"
                    class="handle download"
                    title="下载"
                  ></span>
                </el-popover>

点击操作按钮将v-if里的判断变成true,把下载按钮放出来后发现无法点击，但页面刷新就可以正常点击-唤醒弹窗，所以我认为是组件没实时监测到判断里值的变化

---

解决方案：

组件需要等页面渲染完成后才能拿到DOM元素，这是由于dom的渲染机制导致，所以不再销毁与重建，而是使用display让元素进行显示隐藏，问题终于解决，此问题与ref与v-if不能连用问题一样，解决办法是使用v-show代替v-if

 <span
                    v-show="
                      missions.attachmentType === 1 &&
                        (!getSubmitStatus(missions) ||
                          (loginUl.depType === 1 && loginUl.orgId === 7))
                    "
                    style="pointer-events: auto;"
                    slot="reference"
                    class="handle download"
                    title="下载"
                  ></span>