es6 解构赋值 使用方法的时候，会导致丢失this

Question

今天在使用es6 解构赋值 引入方法的时候，发现在方法里获取不到this，具体详情我贴图吧

先贴代码：

    /*mainVM文件里的方法*/

    @observable planDetailList = [];

    @action

    ajaxPlanDetailList(id,callback){

        Helper.ajax(Api.planList+'/'+id,{

            method:'GET'

        }).then(res => {

            console.log(this);

        })

    }

    /*在componentDidMount时调用mainVM里的方法*/

    componentDidMount() {

        const { ajaxPlanDetailList } = this.props.mainVM;

        ajaxPlanDetailList(this.props.id);

    }

会显示以下错误

换一种方式，直接调用mainVM里的方法，

    componentDidMount() {

        this.props.mainVM.ajaxPlanDetailList(this.props.id);

    }

拿到了this

不是很懂其中的缘由，请大神详解，跪谢

Answer 1

两种思路1 把ajaxPlanDetailList写成箭头函数2 ajaxPlanDetailList绑定一下this 类似 ajaxPlanDetailList.bind(this)

Answer 2

你不解构赋值也会丢失，this上下文是谁调用它就是谁的，比如obj.ajaxPlanDetailList()，那this就是obj，你直接ajaxPlanDetailList()的话this就是全局对象window。function fun() {  console.log(this.a);}let obj1 = {  a: 1,  fun: fun};let obj2 = {  a: 2,  fun: fun};let a = 3;obj1.fun();  // 1obj2.fun();  // 2fun();  // 3