web前段题目1：隐藏显示密码 要求： 1、 点击显示睁眼和明文 2、 再点击显示闭眼和密文

实现隐藏显示密码的方法有多种，以下是一种基于Vue框架和Element UI组件库的实现方法：

1. 定义一个flag变量，默认为false，用于控制密码框的显示方式；
2. 在el-input组件中绑定v-model和type属性，type属性的值根据flag变量的值动态改变；
3. 在el-input组件的后缀中添加一个图标，用于切换密码框的显示方式；
4. 给图标绑定一个点击事件，点击时改变flag变量的值，从而改变密码框的显示方式和图标的样式。

代码如下：

<template>
  <div>
    <el-input v-model="password" :type="passwordType" placeholder="请输入密码" style="width: 300px;">
      <i class="el-input__icon el-icon-view" slot="suffix" @click="togglePassword"></i>
    </el-input>
  </div>
</template>

<script>
export default {
  data() {
    return {
      password: '',
      passwordType: 'password',
      showPassword: false
    }
  },
  methods: {
    togglePassword() {
      this.showPassword = !this.showPassword;
      this.passwordType = this.showPassword ? 'text' : 'password';
    }
  }
}
</script>