Vue Axios 检索列表中对象的响应 ID

Posted 2023-02-23

【中文标题】Vue Axios 检索列表中对象的响应 ID

【英文标题】：Vue Axios retrieve Response ID of object within list

【发布时间】：2019-06-02 06:47:01

【问题描述】：

我有一个 Vue.js 应用程序，我使用 AXios 从数据库返回 API 调用。我设法返回了数据库条目的整个列表 (findAll) 但是我想根据 findAll 返回的 ID 执行 findOne 功能，findAll 的响应将包含所有详细信息及其唯一 ID，@987654324 @ 将获取这些唯一 ID 并将它们附加到 url 参数。

任何帮助或建议将不胜感激。

使用 Vue.js

返回列表

<div class="results" v-if="showResult">
  <div v-for="(response) in response">
    <div class="card-divider">
      <p>response.name response.id
        <!--Potentially a link such as url/response.id-->
        <button @click="getCurrencyOne();">X</button>
      </p>
    </div>
  </div>
</div>

AXIOS全部查找

findAll() 
  axios
    .get(`/url/`)
    .then(response => 
        if (response.status == 200) 
            this.response = response.data

            if (response.data.length == 1)
                console.log("There is one entry")
            
            else if (response.data.length ) 
                console.log("There are " + response.data.length + " entries")
            

            this.showResult = true
        
    );

AXIOS找到一个

findOne() 
  axios(
    method: 'GET',

    //1 would be the id of the object
    url: 'url' + 1,

    headers: 
      'Content-type': 'application/json'
    ,
  )
  .then(response => 
    this.response = response.data.id
      // this.test = response.data.map(currency => currency.id)
      console.log(response.data.id)

      console.log(this.response)
  )

【问题讨论】：

你在后台使用什么？

@BoussadjraBrahim 弹簧引导

你应该在你的休息服务中处理它

@BoussadjraBrahim 我确实有一个函数可以在后端检索 findOne 函数，例如 /url/1，它通过 ID 查找，但是我不知道如何从前面将 ID 分配给 URL 参数结束

id 是数据还是计算属性？如果是这样，你应该做类似axios.get('url'+this.id)

【参考方案1】：

您可以将 id 传递给您的方法 getCurrencyOne(resp.id)：

getCurrencyOne(id) 
  axios(
      method: 'GET',

      //1 would be the id of the object
      url: 'url/' + id,

      headers: 
        'Content-type': 'application/json'
      ,
    )
    .then(response => 
      this.response = response.data.id
      // this.test = response.data.map(currency => currency.id)
      console.log(response.data.id)

      console.log(this.response)
    )

<div class="results" v-if="showResult">
  <div v-for="(resp) in response">
    <div class="card-divider">
      <p>resp.name resp.id

        <button @click="getCurrencyOne(resp.id)">X</button>
      </p>
    </div>
  </div>
</div>

【讨论】：

所以理论上我唯一缺少的就是定义 ID，感谢您的帮助

不客气，如果对你有帮助可以接受我的回答吗？