axios


axios是独立于vue的一个项目,基于promise用于浏览器和node.js的http客户端
  • 在浏览器中可以帮助我们完成 ajax请求的发送
  • 在node.js中可以向远程接口发送请求

1、获取数据

<script src="vue.min.js">script>
<script src="axios.min.js">script>

注意:测试时需要开启后端服务器,并且后端开启跨域访问权限

var app = new Vue({

  el: '#app',

  data: {

      memberList: []//数组

  },

  created() {

      this.getList()

  },


  methods: {


      getList(id) {

          //vm = this

          axios.get('http://localhost:8081/admin/ucenter/member')//服务器地址

          .then(response => {//response返回结果,可以任意定义 
console.log(response) this.memberList = response.data.data.items }) .catch(error => { console.log(error) }) } } })

控制台查看输出

3、显示数据

<div id="app">

  <table border="1">

      <tr>

          <td>idtd>

          <td>姓名td>

      tr>

      <tr v-for="item in memberList">

          <td>{{item.memberId}}td>

          <td>{{item.nickname}}td>

      td>

  tr>

table>
div>