JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.0-rc.3/vue.js"></script>
<div id="app">
  <ul>
    <li v-for="record in records">
      {{ record.text }}
    </li>
  </ul>
</div>

JavaScript

const Component = {
  el: '#app',
  data: {
    records: []
  },
  created: function() {
  	this.reload();
  },
  methods: {
  	reload: function() {
    	// DEBUG
      var payload = {
      	"status": "success",
        "message": "yay",
        "payload": [
          { "text": "first" },
          { "text": "second" }
        ]
      };
      
      var data = new FormData();
			data.append("json", JSON.stringify(payload));
      // DEBUG
      
    	fetch('https://fiddle.jshell.net/echo/json/', {
        method: 'POST',
        body: data
      }).then((response) => {
      	console.log("response object", response);
        
        return response.json();
      }).then((response) => {
      	console.log("response json", response);
        
        if (response.status == 'success') {
          this.records = response.payload;
          console.log("http success", response.message);
        } else {
          console.error("http error", response.message);
        }
      }).catch((err) => {
        console.error("error", err);
      });
    }
  }
};

var vm = new Vue(Component);
vm.reload();

// see also: https://vuejs.org/guide/components.html#Async-Components