Question

我构建了一个代码分析工具，我想在vue表中设置我的json数据。但是，我需要json Key，它是我想要显示的数据目录的包/文件名。

这是json Part（NULLY是包）：

"folderStatistics": {
          "NULLY": {
            "Statistiken": {
              "Werte": {
                "Felder": "0",
                "Konstruktoren": "0",
                "Methoden": "8",
                "Klassen": "1",
                "Codezeilen": "191"
              }
            },

这是我的HTML：

<table class="table table-bordered">
      <thead>
        <tr>
         <th></th>
         <th>Felder</th>
         <th>Konstruktoren</th>
         <th>Methoden</th>
         <th>Klassen</th>
         <th>Codezeilen</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="value in folderStatistics.NULLY.Statistiken">
         <td>{{$key}}</td>
         <td>{{value.Felder}}</td>
         <td>{{value.Konstruktoren}}</td>
         <td>{{value.Methoden}}</td>
         <td>{{value.Klassen}}</td>
         <td>{{value.Codezeilen}}</td>
         </tr> 
      </tbody>

使用“NULLY”，它适用于目录，但NULLY应该是动态的。我该怎么做？它甚至可以工作吗？

Answer 1

documentation

您可以在变量中NULLY说package并在视图中使用它，如下所示：

 <tbody>
    <tr v-for="(value, key) in folderStatistics[package].Statistiken">
     <td>{{key}}</td>
     <td>{{value.Felder}}</td>
     <td>{{value.Konstruktoren}}</td>
     <td>{{value.Methoden}}</td>
     <td>{{value.Klassen}}</td>
     <td>{{value.Codezeilen}}</td>
     </tr> 
  </tbody>

demo fiddle。

Vue.js为v-for获取未知的Json密钥

1 个答案: