使用vue资源,我可以从我的api获取数据并对其进行设置,以便在html中使用它,我的问题是我希望在v-for完成后运行jquery函数,以便jquery可以看到dom中的元素,下面是我的代码:
JS公司

dataUrl = "http://localhost:8081/hesabiha/userSubmissions";

var app = new Vue({
  el: "#campaign",
  methods: {
    getSubmissions: function(){
      this.$http.get(dataUrl, function(submissions){
        this.$set('submissions', submissions);
      });
    },
  },

  ready: function(){
    this.getSubmissions();
  }
});

HTML格式
<div v-for="item in submissions" class="grid-item">
    <img v-bind:src="item.field_image[0].url" alt="Hello">
</div>

我正在尝试对我的页面运行此函数:
$('.grid').masonry({
    // options...
    itemSelector: '.grid-item',
    columnWidth: 200
  });

它不起作用,是不是有什么原因让我可以在v-for完成后运行这个jquery函数?

最佳答案

尝试

getSubmissions: function(){
  var _this = this
  this.$http.get(dataUrl, function(submissions){
    this.$set('submissions', submissions);
    this.$nextTick(function(){/*here the DOM is ready*/})
  }
}

关于javascript - 在vue中完成v-for之后运行jQuery函数吗?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/39168983/

10-11 14:10