JSFiddle - React, Tailwind, and code Playground

by zhouyulong

HTML

<div id="app">
  <ul>
    <li v-if="item.rating.everage > 8.0" v-for="item in movies">
          {{item.title}}
          {{item.rating.everage}}
    </li>
  </ul>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

JavaScript

var app = new Vue({
  el: '#app',
  data: {
    movies: [
    {
        title: '无翼鸟',
        rating: {
          max: 10,
          numRaters: 900,
          everage: 9.0,
          min: 0
        },
      },
      {
        title: '无问西东',
        rating: {
          max: 10,
          numRaters: 714,
          everage: 7.4,
          min: 0
        },
      },
      {
        title: '肖申克的救赎',
        rating: {
          max: 10,
          numRaters: 916,
          everage: 9.6,
          min: 0
        },
      },
      {
        title: '追龙',
        rating: {
          max: 10,
          numRaters: 713,
          everage: 7.3,
          min: 0
        }
      }
    ]
  }
  
  
})