element-plus 使用密码输入框的自定义图标

				<el-input
                  v-model="ruleFormPassword.newPassword"
                  placeholder="请输入新密码"
                  :type="showPassword ? 'text' : 'password'"
                  :style="{ width: '360px' }"
                >
                  <template #suffix>
                    <span class="input_icon" @click="switchPassword">
                    //icon图标
                      <ScIcon v-if="showPassword" style="font-size: 16px" name="icon-mimaxianshi" />
                      <ScIcon v-else style="font-size: 16px" name="icon-mimayincang" />
                    </span>
                  </template>
                </el-input>

const showPassword = ref('text');


// 点击切换密码显示状态
const switchPassword = () => {
  showPassword.value = !showPassword.value;
};



.input_icon {
  cursor: pointer;
  width: 25px;
  height: 15px;
  padding-right: 6px;
  padding-bottom: 10px;
}