vue中使用loadsh实现实时检索，使用箭头函数报错

• 使用npm下载ladash依赖后，引入lodash

import _ from 'lodash'

• 页面代码：

<div class="search">
    <input type="text" v-model="condition" placeholder="搜索社区" v-on:input="lodashSearch">
</div>

• methods方法：

//实时检索
lodashSearch: _.debounce(() => {
    this.getSearchCommunity(); // 添加debounce，防止页面卡死
}, 400),

报错：this.this.getSearchCommunity is not a function

打印this为undefined

后面不使用箭头函数，则程序正常，不报错

 lodashSearch: _.debounce(function(){
    console.log(this); //vue实例对象
    this.getSearchCommunity(); // 添加debounce，防止页面卡死
}, 500),

但是我之前使用lodash做resize事件监听时，使用的是箭头函数，然后程序正常啊，
代码如下：

mounted: function () {
    let _ = require('lodash');
    window.onresize = _.debounce(() => {
    this.initPage(); // 添加debounce，防止页面卡死      
    }, 400);
},

为什么在 mounted 和 methods 里效果不一样呢？

• 原因如下：

methods 将被混入到 Vue 实例中。可以直接通过 VM 实例访问这些方法，或者在指令表达式中使用。方法中的 this 自动绑定为 Vue 实例。

注意，不应该使用箭头函数来定义 method 函数 (例如 plus: () => this.a++)。理由是箭头函数绑定了父级作用域的上下文，所以 this 将不会按照期望指向 Vue 实例，this.a 将是 undefined。

示例：

var vm = new Vue({
  data: { a: 1 },
  methods: {
    plus: function () {
      this.a++
    },
    do(){
      this.a--;
    }
  }
})
vm.plus()
vm.a // 2