Question

因此，我使用axios从URL获取api

这是我的代码：

<html>
<head>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script src="{{asset("/core/vue.js")}}" type="text/javascript"></script>
</head>
<body>
<div id="app">
    @{{ info }}
    <button v-on:click.prevent="GetId($event)" value="1">click me!</button>
</div>

<style>
</style>
<script type="text/javascript" language="JavaScript">
    new Vue({
        el: '#app',
        data: {
                info: null,
                value: null
        },
        methods:{
            GetId:function (event) {
                element = event.currentTarget;
                value = element.getAttribute('value');
                axios
                    .get('/api/GetProduct/'+value)
                    .then(response => (this.info = response))
                    .then(this.value = value)
                    .catch(error => console.log(error))
                }
            },
    })
</script>
</body>
</html>

但是问题是我得到了一个长数组，我只需要其中的数据。

我尝试使用response.$data，但是没有用这是我得到的答复：

{ "data": { "pr-id": 1, "pr-name": "asdda", "pr-amount": 12000, "pr-discount-amount": null, "pr-stock": null }, "status": 200, "statusText": "OK", "headers": { "cache-control": "no-cache, private", "connection": "close", "content-type": "application/json", "date": "Wed, 27 Nov 2019 11:39:12 +0000, Wed, 27 Nov 2019 11:39:12 GMT", "host": "127.0.0.1:8000", "phpdebugbar-id": "Xf9f5355a2b74176afad6c70670477d50", "x-powered-by": "PHP/7.2.17", "x-ratelimit-limit": "60", "x-ratelimit-remaining": "57" }, "config": { "url": "/api/GetProduct/1", "method": "get", "headers": { "Accept": "application/json, text/plain, */*", "X-XSRF-TOKEN": "eyJpdiI6Im92YUluNVwvQkRFeTFFa04wc3lkNXpnPT0iLCJ2YWx1ZSI6ImdJZ1lEZFB5cmlwdzFudGxTYU1ZYXJzXC9rbm4xNUZlSnJcL2ZmenhpOVArbEl0KytFMXo5Z3AxUVBKajdGNkdtQyIsIm1hYyI6IjEzNWVmYjExMTc1NTQwYjY4MjVlOTNlNjllOGEwNTcxMTE2NjY2NTY5OTFiYjFkNmU2ZDhlYmM5OTU1Y2NiNWUifQ==" }, "transformRequest": [ null ], "transformResponse": [ null ], "timeout": 0, "xsrfCookieName": "XSRF-TOKEN", "xsrfHeaderName": "X-XSRF-TOKEN", "maxContentLength": -1 }, "request": {} }

我只需要这部分：

"data": { "pr-id": 1, "pr-name": "asdda", "pr-amount": 12000, "pr-discount-amount": null, "pr-stock": null }

Answer 1

axios的响应是一个JS对象，因此您可以使用普通的JS功能，即。

axios.get(url)
  .then(response => {
    this.info = response.data
  })
  .catch(error => console.log(error))

在此处查看文档：{{3}}。

来自文档：

请求的响应包含以下信息。

{
  // `data` is the response that was provided by the server
  data: {},

  // `status` is the HTTP status code from the server response
  status: 200,

  // `statusText` is the HTTP status message from the server response
  statusText: 'OK',

  // `headers` the headers that the server responded with
  // All header names are lower cased
  headers: {},

  // `config` is the config that was provided to `axios` for the request
  config: {},

  // `request` is the request that generated this response
  // It is the last ClientRequest instance in node.js (in redirects)
  // and an XMLHttpRequest instance in the browser
  request: {}
}

从axios响应（Vuejs）获取数据

1 个答案:

来自文档：