在呈现之前隐藏vue.js模板

我试图在完全呈现之前隐藏vue.js模板的内容。考虑以下模板：

<div class="loader"> 
  <table class="hidden">
    <tr v-for="log in logs">
      <td>{{log.timestamp}}</td>
      <td>{{log.event}}</td>
    </tr>
  </table>
</div>

当我在服务器上呈现此模板时，用户<tr>会在呈现元素之前先查看其内容。hidden因此，在完全渲染之前，我使用该类将其隐藏。

同样在渲染之前，我正在显示带有一些动画进度栏的加载器元素。

呈现后，我只需调用element.show()jQuery并隐藏进度条即可。我的问题是：可以将jQuery和vue.js混合使用以实现这一目标吗？

var vueLogs = new Vue({
  el: "#checkInLogsHolder",
  data: {logs: []}
});
var holder = $("#checkInLogsHolder");

function response(payload) {
  // hiding the loader animation
  holder.find(".loader").remove();
  // showing the rendered table
  holder.find("table").show();
  vueLogs.logs.unshift(payload);
}

有更好的方法吗？