初试ajax端口

熟悉GET./POST.指令从云端接口获取信息；

数据来源是Easy Mock创建的数据，创建vue项目还是基本步骤走，cmd到工程目录下---

npm init -y 初始化项目依赖， 再yarn一下，yarn add -D vite ||  yarn add vue  ||  yarn add -D @vitejs/plugin-vue 这仨可以说是vue依赖三步走；（不知道后期在工作项目中，如果我想用vue，还需不需要导入）

    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.js"></script>
    <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>

vue包是一定要导入的，因为我需要用到@click方法；（我已经忘了js怎么绑定点击事件了）....好像得document.getelementbyId？算了，jQuery都比这个简便....所以我引用了jquery.js---尽管后面可能用不到

<script>
    const Root = {
      data() {
        return {};
      },
      methods: {
        getEvent() {
          var xhttp = new XMLHttpRequest();
          xhttp.open("GET","https://mock.mengxuegu.com/mock/642f630132affa39a121cd8d/example/api/getEvent",true);
          xhttp.send()
        },
      },

      template: "<button @click='getEvent'>Get</button>",
    };

    Vue.createApp(Root).mount("#app");
  </script>

Vue的基本语法。这里没有做拆分，是直接在index.html中引用的。

template中其实就是html5的格式，@click---vue语法，绑定了点击事件。

其实如果划分出来一个app.vue工程文件，用<template></template>标签也是这种效果，

不过只是一个片段练习..没有必要。

重点是methods！ jquery.ajax(可能是)的XMLHttpRequest()方法，

这个地方咋调用XMLHttpRequest()呢，手册是这么说的-----

 于是就有了xhttp.open()和xhttp.send()指令，

保存，跑一下，见证奇迹。

拿到了数据。不出意外...

大概就是这样。不过我安装然后使用axois方法再获取的时候反复报错；不知道是哪个地方出了问题，不过大概ajax获取端口就是这样了；再麻烦的话就是核对头部和密码之类的。