JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://unpkg.com/vue"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
<div id="app">
  <div>
    <thumbnailpage v-for="page in pages" :key="page.screen_id" :page="page"></thumbnailpage>
  </div>
  <div><button v-on:click="addPage">Add Page</button></div>
</div>
<template id="thumbnailpage">
  <div class="page_thumbnail"></div>
</template>

CSS

.page_thumbnail {
  width: 20px;
  height:20px;
  background-color: #fff;
}

JavaScript

var screenId = 2;
var pageCountInit = 0;
var pagesInit = [];

const baseGlobal = {
  pageStructure: {
    screen_id: screenId,
    page_config: {
      bg_src: null
    },
    sequence: null
  }
};

Vue.component('thumbnailpage', {
  template: '#thumbnailpage',
  props: ['page'],
  data: function () {
    return {

    }
  },
  watch: {

  }
});

var app = new Vue({
  el: '#app',
  data: {
    pageCount : pageCountInit,
    pages: pagesInit
  },
  methods: {
    addPage: function() {
      var tmpl = $.extend({}, baseGlobal.pageStructure);
      tmpl.sequence = ++this.pageCount;
      this.pages.push(tmpl);
    }
  }
});