Raú*_*tín 5 javascript babel ecmascript-6 webpack
我有一个工具提示的bootstrap修改.并使用webpack/babel处理我的js
我的代码的简化可以是:
$('[data-toggle="tooltip"]').tooltip({
title: () => {
return $(this).children('.tooltip-html-content').html();
}
});
Run Code Online (Sandbox Code Playgroud)
这应该是元素,bootstrap将调用此函数:
getTitle: function () {
var title
, $e = this.$element
, o = this.options
title = $e.attr('data-original-title')
|| (typeof o.title == 'function' ? o.title.call($e[0]) : o.title)
return title
}
Run Code Online (Sandbox Code Playgroud)
重要的是:
o.title.call($e[0])
Run Code Online (Sandbox Code Playgroud)
其中$ e [0]是工具提示dom元素.
好吧,当我用babel处理这个结果时,结果会改变this为_thisa,然后他将_this分配给他认为真实的值.
问题:我可以在babel中避免这种特定功能的转换吗?
=====
基于响应的最终解决方案:
getTitle: function getTitle() {
Run Code Online (Sandbox Code Playgroud)
T.J*_*der 14
您已经使用了箭头函数,根据定义this它会关闭它创建的位置.
如果您不想要这种行为,请不要使用箭头功能:
$('[data-toggle="tooltip"]').tooltip({
title: function() {
// ----^^^^^^^^^^
return $(this).children('.tooltip-html-content').html();
}
});
Run Code Online (Sandbox Code Playgroud)
重新编辑:
我想使用箭头功能.我更喜欢做一个排除babel而不是排除的情况.
你不能,不能这样getTitle,因为它让你访问元素的唯一方法是设置this.箭头函数本质上是固定的this(根本没有一个;它们在创建它们的执行上下文中关闭,这是固定的).您不能对要this由调用者确定的任何函数使用箭头函数,例如在这种情况下.
您可以选择修改Bootstrap,也可以使用普通功能.后者似乎更合理.
| 归档时间: |
|
| 查看次数: |
1131 次 |
| 最近记录: |