在线考试的密码修改用vue2如何实现

首先在Vue组件中定义一个data属性来存储密码的原始值和新值：

data() {
  return {
    oldPassword: '',
    newPassword: '',
  }
}

在模板中添加输入框和按钮，用于输入原始密码、新密码和提交修改请求：

<template>
  <div>
    <label for="oldPassword">原始密码：</label>
    <input type="password" id="oldPassword" v-model="oldPassword">
    <br>
    <label for="newPassword">新密码：</label>
    <input type="password" id="newPassword" v-model="newPassword">
    <br>
    <button @click="submit">修改密码</button>
  </div>
</template>

在Vue组件的methods中定义submit方法，用于提交密码修改请求，并在请求成功后提示用户修改成功：

methods: {
  submit() {
    // 发送密码修改请求
    axios.post('/change_password', {
      oldPassword: this.oldPassword,
      newPassword: this.newPassword,
    })
    .then(response => {
      // 如果请求成功，则提示用户修改成功
      alert('密码修改成功！');
    })
    .catch(error => {
      // 如果请求失败，则提示用户错误信息
      alert('密码修改失败：' + error.message);
    });
  }
}

最后，引入axios库，用于发送密码修改请求：

<script>
import axios from 'axios';

export default {
  data() {
    return {
      oldPassword: '',
      newPassword: '',
    }
  },
  methods: {
    submit() {
      axios.post('/change_password', {
        oldPassword: this.oldPassword,
        newPassword: this.newPassword,
      })
      .then(response => {
        alert('密码修改成功！');
      })
      .catch(error => {
        alert('密码修改失败：' + error.message);
      });
    }
  },
}
</script>

``