vue实现input 密码切换显示隐藏

vue实现input 密码切换显示隐藏，日常笔记，记录完成步骤，下次遇到同样的问题可以直接拿来用。
实现效果：

html

<div class="passward">
  <input :type="passwordType" class="text-input" v-model="query.pwd" placeholder="请输入密码" />
  <img :src="paSrc" alt="" @click="changePassward">
</div>

js

data() {
  return {
    passwordType: 'password',
    paSrc: require("@/assets/images/login_pass_active.png"),
  }
}

点击小眼睛按钮：

// 切换密码显示隐藏
changePassward() {
  this.passwordType = this.passwordType==='password'?'text':'password';
  this.paSrc = this.paSrc == require("@/assets/images/login_pass_active.png")?require('@/assets/images/login_pass.png'):require("@/assets/images/login_pass_active.png");
},