0

Vue-Resource の使い方を学んでいますが、使用している API で壁にぶつかりました。を使用してスレッドのリストを設定しようとしていv-for: thread in threadsます。

これが私が取り組んでいるもののサンプルです：

[{
"threads": [{
    "no": 1,
    "name": "John",
    "com": "comment"
},{
    "no": 2,
    "name": "Jim",
    "com": "comment"
},{
    "no": 3,
    "name": "Jane",
    "com": "comment"
}],
"page": 0
}, {
"threads": [{
    "no": 4,
    "name": "Tom",
    "com": "comment"
},{
    "no": 5,
    "name": "Mark",
    "com": "comment"
}],
"page": 1
}]

{{ thread.name }}{{ thread.com }}APIには、いくつかのページにリストされたスレッドがあります。私が欲しいのは、それぞれのようなリストですが、novue-resourceを使用してその情報を取得する方法が完全にはわかりません. 現在、私が使用している場合

<li v-for="thread in threads"> {{ thread.name }}{{ thread.com }} </li>

空のアイテムのリストを取得するだけです。

4

1 に答える 1

0

まず、名前の値を二重引用符で囲み、JSON を pages という変数に保存しました。

var pages=[
  {
    "threads": [
      {
        "no": 1,
        "name": "John",
        "com": "comment"
      },
      {
        "no": 2,
        "name": "Jim",
        "com": "comment"
      },
      {
        "no": 3,
        "name": "Jane",
        "com": "comment"
      }
    ],
    "page": 0
  },
  {
    "threads": [
      {
        "no": 4,
        "name": "Tom",
        "com": "comment"
      },{
        "no": 5,
        "name": "Mark",
        "com": "comment"
      }
    ],
    "page": 1
  }
]

次に、HTMLは次のようになります

<div v-for:"page in pages">
  <div class="page" v-for"thread in page.threads">
    <div>{{thread.name}}{{thread.com}}</div>
  </div>
</div>
于 2016-08-18T17:41:18.850 に答える