VUE JS提取JSON数据并以纯文本格式显示HTML中的单个值

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 个解决方案

解决方案1
0 已采纳 2018-01-10 02:15:11

VUE JS提取JSON数据并以纯文本格式显示HTML中的单个值

问题描述

1 个解决方案

解决方案1 0 已采纳 2018-01-10 02:15:11

解决方案1
0 已采纳 2018-01-10 02:15:11