es6多级回调函数绑定this

  • js的高级病。没救的那种。看看杂家怎么临时治疗一下!

方案1:

  • 使用bind方法 绑定
layui.use('colorpicker', function() {
         var colorpicker = layui.colorpicker;
          //渲染
          colorpicker.render({
            elem: '#test-form',  //绑定元素
            color: '#6400ff',
            done: function(color){
                console.log(color, this)
                this.setState({color})
            }.bind(this)
          });
        }.bind(this));
  • 通过代码能看出。只需给回调的函数绑定一下即可。每个回调都要绑定。

方案2:

  • 使用es6的箭头函数。这个比较方便。
        layui.use('colorpicker', () => {
          var colorpicker = layui.colorpicker;
          //渲染
          colorpicker.render({
            elem: '#test-form',  //绑定元素
            color: '#6400ff',
            done: (color) => {
                console.log(color, this)
                this.setState({color})
            }
          });
        });

此方法只适用于es6以上。5还是老老实实的用bind绑定吧。

你可能感兴趣的:(es6多级回调函数绑定this)