vue获取json数组中的值

你可以使用 `v-for` 循环遍历 json 数组，然后使用 `{{}}` 插值语法来获取数组中的值。示例代码如下：

<div v-for="item in jsonArray">
  {{ item.field1 }}
  {{ item.field2 }}
</div>

其中，`jsonArray` 为你的 json 数组变量，`field1` 和 `field2` 是你想要获取的字段名。你也可以在 `v-for` 中使用索引来获取数组中的值。例如：

<div v-for="(item, index) in jsonArray">
  {{ index }}. {{ item.field1 }}
  {{ index }}. {{ item.field2 }}
</div>

这样就可以在循环中获取每个元素的索引值了。

相关问题

vue取json数组的键值名加入数组

在Vue中，我们可以通过以下步骤将JSON数组的键值名加入另一个数组：

1. 首先，创建一个空数组，用于存储键值名。

let keyNames = [];

2. 接下来，使用`Object.keys()`方法获取JSON数组的所有键名。

let jsonArr = {"key1": "value1", "key2": "value2", "key3": "value3"};
keyNames = Object.keys(jsonArr);

3. 现在，`keyNames`数组中将包含JSON数组的所有键值名。

完整的代码如下所示：

<template>
  <div>
    <p>JSON数组的键值名：</p>
    <ul>
      <li v-for="key in keyNames" :key="key">{{ key }}</li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      keyNames: []
    };
  },
  created() {
    let jsonArr = {"key1": "value1", "key2": "value2", "key3": "value3"};
    this.keyNames = Object.keys(jsonArr);
  }
};
</script>

通过以上步骤，我们可以将JSON数组的键值名加入到Vue中的数组中，并在页面上展示出来。

axios获取json数组

要通过axios获取json数组，你可以使用axios的get方法来发送请求并获取数据。在获取到数据后，你可以将其存储在Vue实例的data属性中，以便在页面中使用。

以下是一个示例代码，展示了如何使用axios获取json数组：

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script src="../js/vue.js"></script>
<script>
  const app = new Vue({
    el: '#app',
    data: {
      list: null // 定义一个变量来存储返回的json数据
    },
    methods: {
      getMovies: function() {
        // 在axios回调函数内部，this是window，不是Vue对象
        // 定义局部变量that代替Vue对象
        var that = this;
        
        // 使用axios的get方法发送请求
        axios.get("http://localhost:3205/getMovies").then(function(resp) {
          // resp是服务器的响应，里面存有json数据，json的数据存放在resp.data中
          that.list = resp.data;
        });
      }
    },
    mounted: function() {
      // 通过这个方法可以在页面渲染时自动调用getMovies方法
      this.getMovies();
    }
  });
</script>

在上述代码中，我们通过axios的get方法发送请求，并在回调函数中将返回的json数据存储在Vue实例的list属性中。然后，我们可以在页面中使用这个list属性来展示获取到的json数组数据。