Question

我有一个.json文件，其结构如下：

{
  "d": {
    "value1": "300",
    "value2": "0000000002",
    "value3": "AAAA",
  }
}

我想在我的vue-app中访问300并将其显示为纯文本。那就是它。

问题可能是愚蠢的，但我没有得到它，我的代码也无法运作。

你能给我一个如何做到这一点的例子吗？

格尔茨，西蒙

app.vue：

new Vue({
    el: "#vue-root",
    data: {
        items:[]
    },
    created(){
        this.fetchData()
    },
    methods: {
     fetchData() {
       this.$http.get('test.json')
         .then(result => {
            this.items = result.data
          })
     }
   }
 })

的index.html：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Simon VueJS</title>
    <link href="styles.css" rel="stylesheet" />
    <script src="https://unpkg.com/vue"></script>
  </head>
  <body>

   <div>
           {{ d.value1}}

     </div>

<script src="app.vue"></script>
  </body>
</html>

Answer 1

溶液：

 <div>
           {{ d && d.value1}}

     </div>

VUE JS获取JSON数据并将HTML中的单个值显示为纯文本

1 个答案: