Question

我正在尝试将数据值评论访问到scroll方法中。通过console.log（this.reviews）进行控制台审查。但它始终返回未定义的值；

data() {
  return {
    m: '',
    rating: '',
    review: '',
    visibility: '',
    reviews: [],
    page: 1,
  };
},



scroll (page) { 
  $('#profile-edits-more').on("scroll", function() {      
    if(jQuery(this).scrollTop() + jQuery(this).innerHeight() >= this.scrollHeight) { 
      var vm = this;
      axios.post('./fetch-reviews?page='+page, {
        m: vm.m,
      })
      .then(response => {
        page +=1; 
        console.log(this.reviews);
      });       
    }
  });
},

Answer 1

错误的this尝试：

scroll (page) { 
  var vm = this;
  $('#profile-edits-more').on("scroll", function() {      
    if(jQuery(this).scrollTop() + jQuery(this).innerHeight() >= this.scrollHeight) { 
      axios.post('./fetch-reviews?page='+page, {
        m: vm.m,
      })
      .then(response => {
        vm.page += 1; 
        console.log(vm.reviews);
      });
    }
  });
},

UPD：

$('#profile-edits-more').on("scroll", ===> function() <=== {

表达式function() ...创建一个新范围（具有新的this）。您还可以将箭头方法用于此类事情：

scroll(page) { 
  let $el = $('#profile-edits-more');
  $el.on('scroll', () => {
    if ($el.scrollTop() + $el.innerHeight() >= $el.scrollHeight) { 
      axios.post('./fetch-reviews?page='+page, {
        m: this.m,
      })
      .then(response => {
        this.page += 1; 
        console.log(this.reviews);
      });
    }
  });
},

vue js数据值在方法内部返回未定义

1 个答案: