【解决方案】element show-password弹框关闭如何将小眼睛还原

背景描述

因为我们的密码输入框是放在弹出框里的，element show-password 在弹框里打开小眼睛,关闭弹框,再打开小眼睛仍开着，感觉比较尴尬，如下：

问题：
打开小眼睛后，不刷新页面下一次打开弹框，
小眼睛还是打开的……

解决方案

当关闭弹框时，通过一个变量使用v-if将输入框隐藏，打开弹框时又显示

核心代码：

html部分

 <el-dialog
   :visible.sync="dialogFormVisible"
   :close-on-click-modal="false"
   :before-close="handleDialogClose"
   @opened="handleDialogOpened"
 >
	 <el-input
	   v-if="pwdSwitch"
	   v-model.trim="dataForm.password"
	   type="password"
	   show-password
	 />
 </el-dialog>

js部分
弹框关闭后，将变量值设置false

 handleDialogClose() {
    this.dialogFormVisible = false;
    this.pwdSwitch = false;
 }

弹框打开时，将变量值设置true

handleDialogOpened(){
   this.pwdSwitch = true;
}

有更好的办法，欢迎留言和讨论。