vue登录页面 ，记住密码功能实现，记住所有登录过的账号密码，如果账号正确，自动输入密码，代码实现

要实现Vue登录页面记住密码功能，可以使用localStorage存储已登录过的账号和密码，然后在登录页面中获取localStorage中的数据，进行判断和展示。

具体实现步骤如下：

1. 在登录页面中添加记住密码的选项，可以使用checkbox实现，例如：

<label>
  <input type="checkbox" v-model="remember">
  记住密码
</label>

2. 在登录页面的created生命周期中，获取localStorage中存储的已登录过的账号和密码。如果存在，则将其赋值给登录表单中的用户名和密码字段。例如：

created() {
  const users = JSON.parse(localStorage.getItem('users')) || []
  const lastUser = users[users.length - 1]
  if (lastUser && lastUser.remember) {
    this.username = lastUser.username
    this.password = lastUser.password
    this.remember = true
  }
}

3. 在登录成功后，判断是否选择了记住密码选项。如果选择了，则将当前登录的账号和密码存储到localStorage中。例如：

login() {
  // 登录逻辑
  if (this.remember) {
    const user = { username: this.username, password: this.password, remember: true }
    const users = JSON.parse(localStorage.getItem('users')) || []
    const index = users.findIndex(u => u.username === this.username)
    if (index === -1) {
      users.push(user)
    } else {
      users.splice(index, 1, user)
    }
    localStorage.setItem('users', JSON.stringify(users))
  }
}

4. 如果需要自动输入密码，可以在登录表单的mounted生命周期中，监听用户名字段的变化。如果输入的用户名在localStorage中存在对应的密码，则自动填充密码字段。例如：

mounted() {
  this.$watch('username', (newVal) => {
    const users = JSON.parse(localStorage.getItem('users')) || []
    const user = users.find(u => u.username === newVal && u.remember)
    if (user) {
      this.password = user.password
      this.remember = true
    } else {
      this.password = ''
      this.remember = false
    }
  })
}

这样就实现了Vue登录页面记住密码并自动填充密码的功能。需要注意的是，由于localStorage中存储的是明文密码，存在一定的安全风险，建议在实际项目中使用加密存储。