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绑定吧。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容