Using jQuery with classes from ES6
Using jQuery with classes from ES6
我刚刚在新项目中遇到了一个小问题。基本上,作为页面的一部分,有一个帖子页面和一些来自后端的评论。我想做的就是为这些提供一些JavaScript逻辑。我所做的是提供的:
class Comment {
constructor(comment) {
console.log("Creating comment object...");
$(comment).find(".vote").click(this.toggle_vote);
$(comment).find(".action.reply").click(this.toggle_reply);
}
toggle_vote() {
// Context here is `span.reply`, not Comment instance,
// but I want to access class members
if ($(this).is(".voted")) {
$(this).removeClass("voted");
return;
}
$(this).addClass("voted");
$(this).siblings().first().removeClass("voted");
}
// ...
}
下面的问题在于jQuery回调样式。当我将类成员传递给jQuery回调时,在调用中,jQuery模拟其上下文,因此this
是span.reply
,而不是Comment
实例。重点是我希望能够达到实际的评论实例。
免责声明:我根本不是前端人员,所以我可能需要一些严格的解释来解决这个问题,谢谢
您可以使用.bind 为函数定义this对象
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind
在您的情况下
.click(this.toggle_vote.bind(this))
相关文章:
- ES6构造函数返回基类的实例
- 如何在下面的ES6循环中获得前面的文本
- es6 相当于下划线查找位置
- 如何在Javascript/ES6中的Aurelia浏览器应用程序中使用AWS S3
- ES6生成器:.next()的输入值
- 简单的ES6承诺问题-交换解决和拒绝参数
- 映射数组ES6时考虑空值
- @@(“at at”)在ES6 JavaScript中是什么意思
- 在ES6中,模块将导致多个网络调用,因为两个模块不能在单个文件中定义
- ES6是否引入了一种机制来生成块范围的函数语句(而不是表达式)
- 使用Ember-cli项目中的ES6库
- JShint-.jshintrc中的ES6有esversion,但仍收到警告(使用atom)
- 在ES6 Promise中,我应该在解决/拒绝之前使用return吗
- Unexpected Transpile ES6>ES5
- Validate JSON from Mongo?
- creating objects from variables ES6
- Using jQuery with classes from ES6
- 无法在Babel中使用es6 ' export Module from 'file' '
- ES6:“import $ from 'jquery'"的真正含义
- ES6 `export * from import`?