vue 使用自己封装的原生 ajax

如果你想在 Vue 中使用自己封装的原生 ajax，可以按照以下步骤操作：

1. 在 Vue 组件中定义一个方法，用于发送 ajax 请求：

methods: {
  ajax: function(options) {
    var xhr = new XMLHttpRequest(); //创建 XMLHttpRequest 对象
    xhr.onreadystatechange = function() {
      if (this.readyState == 4) {
        //请求完成
        if (this.status == 200) {
          //请求成功
          options.success(xhr.responseText);
        } else {
          //请求失败
          options.error(xhr.status);
        }
      }
    };
    xhr.open(options.method, options.url, true); //设置请求方法和地址
    xhr.send(options.data); //发送请求
  }
}

在上述代码中，`ajax` 方法接收一个对象作为参数，包含以下属性：

- `method`：请求方法，例如 `"GET"` 或 `"POST"`。
- `url`：请求地址。
- `data`：发送的数据，可以是字符串或 FormData 对象。
- `success`：请求成功时的回调函数。
- `error`：请求失败时的回调函数。

2. 在组件中调用 `ajax` 方法发送 ajax 请求：

this.ajax({
  method: 'POST',
  url: '/api/login',
  data: new FormData(document.querySelector('#login-form')),
  success: function(response) {
    console.log(response);
  },
  error: function(status) {
    console.log('请求失败，状态码为：' + status);
  }
});

在上述代码中，我们通过调用 `ajax` 方法来发送一个 POST 请求，将表单数据作为参数传递给 `data` 属性。当请求成功时，会调用 `success` 回调函数，将服务器返回的数据作为参数传递给它。当请求失败时，会调用 `error` 回调函数，将 HTTP 状态码作为参数传递给它。