Vue 全局密码显示隐藏设置：使用混入功能

要实现全局的密码显示隐藏设置，可以使用 Vue 的全局混入 (mixin) 功能。

首先，创建一个名为passwordMixin.js的文件，内容如下：

export default {
  data() {
    return {
      showPassword: false
    }
  },
  methods: {
    togglePassword() {
      this.showPassword = !this.showPassword
    }
  }
}

然后，在main.js中引入该混入：

import Vue from 'vue'
import passwordMixin from './passwordMixin'

Vue.mixin(passwordMixin)

现在，你可以在任何组件中使用showPassword和togglePassword了，例如：

<template>
  <div>
    <input type='password' v-model='password'>
    <button @click='togglePassword'>显示/隐藏密码</button>
    <p v-if='showPassword'>{{ password }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      password: ''
    }
  }
}
</script>

这样，在任何组件中，都可以使用showPassword来控制密码的显示和隐藏，而togglePassword方法可以切换密码的显示状态。