Vue 修改类型使密码显示隐藏及图标变化

Vue 通过修改input的类型，达到密码显示隐藏，还有图标的变化。
显示效果：

html

<li>
          <input class="psd" :type="pwdType" placeholder="请输入新密码" @on-change="password" maxlength="18"
                 v-model="password">
          <img :src="openeye" class="eye" alt="" @click="changeType()">
        </li>

JavaScript

<script>
  export default {
    data() {
      return {
        pwdType: 'password', // 密码类型
        openeye: require('@/assets/eye.png'), //图片地址

      }
    },
    methods: {
      changeType() {
        this.pwdType = this.pwdType === 'password' ? 'text' : 'password';
        this.openeye = this.openeye == require("@/assets/eye.png") ? require("@/assets/eye.png") : require("@/assets/neye.png");
      },
    }
  }
</script>