【问题标题】:VueJS method json response to selectbox?VueJS方法json响应选择框?
【发布时间】:2018-05-22 13:18:03
【问题描述】:

我有一个 VueJS 组件,现在我从 JSON 响应中获取,我想将它导出到一个 html 选择框。

我的 VueJS 方法:

getTaskList() {
    axios.get('/api/v1/tasklist').then(response => {
        this.taskList = this.data.taskList;
    });
}

我在VueJS documentation 中找到了示例,但方法仍然存在问题...

如何将此响应导出到选择框,我知道如何使用v-for,但我不知道如何在 HTML 中初始化此数据(使用 v-bind 或类似的东西)?

【问题讨论】:

  • 你从/api/v1/tasklist得到了什么?

标签: javascript json vue.js vuejs2


【解决方案1】:

我不知道 taskList 项目中的内容,但您可以简单地将这些数据绑定到 option 标签中:

<select v-model="selectedTask">
  <option v-for="task in taskList" :key="task.id" :value="task.value">{{ task.label }}</option>
</select>

【讨论】:

  • 这个我知道,但是我必须在 JS 代码中定义 v-model="selectedTask" 吗?
  • 已解决,我在挂载区域调用了这个函数,并不能正常工作(this.getTaskList())
  • 你甚至可以在created钩子中调用这个方法,这样你的数据就会尽快准备好(你不需要等待元素被挂载来加载这些数据) .抱歉,我一开始没明白你的问题。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-08-26
  • 1970-01-01
  • 2016-10-11
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多