Node.js Vue不呈现新数据

我正在尝试使用Vue和更改DOM，使用从POST方法获得的信息。 我有一个名为treeview的组件：

<div id="treeview" class="col-sm-3" style="overflow-y: auto">
  <ul>
    <li v-for="file in files" v-on:click="openFile(file)">
      <i v-bind:class="file.filetype"></i> {{file.name}}
    </li>
  </ul>
</div>

什么是使其更改DOM的正确方法？

在外部声明：

var filedropdown = new Vue({
  el: '#treeview',
  data: {
    files: JSON.parse('[]')
  }
})

更新如下：

function ReadRede(){
  $.ajax({
    type: 'POST',
    contentType: 'application/json',
    url: "/ReadRede",
    success: function(datarec) {
      console.log(datarec);
      filedropdown.files = JSON.parse(datarec);
    }
  });
}

function ReadLocal(){
  var pathAtt = {
    path: localStorage.local
  }
  $.ajax({
    type: 'POST',
    contentType: 'application/json',
    url: "/ReadLocal",
    data: JSON.stringify(pathAtt),
    success: function(datarec) {
      console.log(datarec);
      filedropdown.files = JSON.parse(datarec);
    }
  });
}

---

它工作正常，但正确吗？

在函数中不应该像vue那样使用。只需启动一个新的vue实例，并将您的逻辑放在方法或created（）函数中。在回调中实例化vue本身并没有什么错。但是，在本例中，我没有看到任何实际调用启动AJAX调用的函数的内容，当然，您也不希望在同一个元素上实例化两个Vue。一个AJAX调用将首先完成，然后

#treeview

将消失，第二个将失败。因此，我希望可以进行一些重构。您只需要

filedropdown.files=JSON.parse（datarec）

。否则看起来不错。

function ReadRede(){
  $.ajax({
    type: 'POST',
    contentType: 'application/json',
    url: "/ReadRede",
    success: function(datarec) {
      console.log(datarec);
      filedropdown.files = JSON.parse(datarec);
    }
  });
}

function ReadLocal(){
  var pathAtt = {
    path: localStorage.local
  }
  $.ajax({
    type: 'POST',
    contentType: 'application/json',
    url: "/ReadLocal",
    data: JSON.stringify(pathAtt),
    success: function(datarec) {
      console.log(datarec);
      filedropdown.files = JSON.parse(datarec);
    }
  });
}