从 vue 访问格式为 json 的 axios 数据

Question

我需要显示来自 get 请求的 json 响应的数据。我的代码的 Vue 部分是：

<script type="text/javascript">

  var vm = new Vue({
      el: '#app2',
      delimiters: ['[[',']]'],
      data: {
        masa_data: {},
      },
      mounted: function() {

              polling1=setInterval(function() {
              axios.get('/order')
                  .then(function(response) {
                      vm.$data.masa_data = response.data;
                  })
          }, 1000);        
      },

      beforeDestroy () {
        clearInterval(this.polling1)
      }
  });
</script>

masa_data 来自 axios 如下：

{ "Bahçe1": { "A": { "1": { "kisi_sayisi": "2", "siparisler": [ { "adet": 2, "bolum": "drink", "satir": "Açık Çay" }, { "adet": 1, "bolum": "tatli", "satir": "Kaymaklı Ekmek Kadayıfı" } ] },

例如，当我想显示 "kisi_sayisi" 的值时，我不知道要在下面的 html 代码中放什么：

<p class="card-text">[[masa_data]]</p>

Answer 1

试试这个。

<p class="card-text" v-if="Object.values(masa_data).length>0">[[masa_data.Bahce1.A['1']['kisi_sayisi'] ]]</p>

https://codepen.io/Pratik__007/pen/QWbjOxE?editors=1010

从 vue 访问格式为 json 的 axios 数据

Access an axios data formatted as json from vue

json

response

flask

vue.js

axios