使用Vue JS将Json迁移到HTML

时间:2017-04-26 06:58:00

标签: javascript jquery json

我有一个使用vue.js的json到html,我想在赔率和赔率大于1.44的情况下仅显示选择

的Json

{"soccerodds2017":[
{"Selections":"Chelsea","Odds":"1.44","Oddsw":"1.42"},
{"Selections":"Wolverhampton","Odds":"2.33","Oddsw":"1.25"},
{"Selections":"Walsall","Odds":"2.70","Oddsw":"1.50"}]}

现在JS

$(function () {
    var JSONTableApp = new Vue({
        el: '#JSONTableApp',
        data: {
            Loading: false,
            Results: [],
            Ready: false,
            SearchInput: '',
            ResultsPerPage: 10,
            Data: [],
            CurrentPage: 1,
            NumberOfPages: 10,
            NumberOfResults: 0,
            NoResultsFound: false,
            PaginatedResults: [],
            OrderBy: 'Selections',
            OrderType: 'asc', //'asc', 'desc',
            UnableToLoadData: false

或当赔率和赔率大于零时。

1 个答案:

答案 0 :(得分:0)

您可以使用计算机:

new Vue({
  el: '#JSONTableApp',
  data: {
    results: []
  },
  computed: {
    filteredResults() {
      return this.results.filter(function(item) {
        return item.odds > 0 && item.oddsw > 0;
      });
    }
  }
})

现在你可以在你的html中使用它了:

<ul>
  <li v-for="result in filteredResults">
    ...
  </li>
</ul>