Rivets.js - on-[event]绑定器和回调函数
Rivets.js - on-[event]绑定器和回调函数
提问于 2019-04-07 15:58:37
演示应用：https://glitch.com/~rivets-so
我将对象与数据和函数(控制器)绑定在一起。此对象在JS类中进行管理。使用事件绑定时，会调用一个函数，但它不能访问对象本身(在我的示例中是importantData变量)。这样做有可能吗？
index.html：
<!DOCTYPE html>
<html lang="en">
<head>
<title>Hello!</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://cdnjs.cloudflare.com/ajax/libs/rivets/0.9.6/rivets.bundled.min.js"></script>
<script type="module" src="/main.js" defer></script>
</head>
<body>
<h1>
Simple app
</h1>
<div id="content">
<span rv-on-click="data.controller.click">{ data.data.Nom }</span>
</div>
</body>
</html>main.js：
import { Controller } from '/controller.js';
var controller = new Controller('Important data');
rivets.bind(document.querySelector('#content'), { data: controller.getData() });controller.js：
export class Controller {
constructor(importantData) {
this.importantData = importantData;
}
getData() {
return {
data: {
Nom: 'Francis'
},
controller: {
click: function(event, model) {
console.log("Click !");
// this represent the element clicked, not the class itself
console.log(this.importantData);
}
}
};
}
}回答 1
Stack Overflow用户
回答已采纳
发布于 2019-04-09 16:11:24
解决方案是在我的类Controller中使用箭头函数：
export class Controller {
constructor(importantData) {
this.importantData = importantData;
}
getData() {
return {
data: {
Nom: 'Francis'
},
controller: {
click: (event, model) => {
console.log("Click !");
// this represent the element clicked, not the class itself
console.log(this.importantData);
}
}
};
}
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55556833
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号