#javascript #html #ember.js
#javascript #HTML #ember.js
Вопрос:
Пытаюсь вызвать одну из моих функций компонентов ember, однако я получаю сообщение об ошибке: e-signature.js:28 Uncaught TypeError: this.testFunc is not a function
Однако я четко объявил функцию. Я вызываю, testFunc()
когда пользователь нажимает на мышь (когда выдается ошибка). В чем проблема?
Component.js
импортируйте Ember из ’ember’;
export default Ember.Component.extend({
mousePressed: false,
lastX: 0,
lastY: 0,
ctx: null,
Draw(x, y, isDown) {
if (isDown) {
this.ctx.beginPath();
this.ctx.strokeStyle = $('#selColor').val();
this.ctx.lineWidth = $('#selWidth').val();
this.ctx.lineJoin = "round";
this.ctx.moveTo(this.lastX, this.lastY);
this.ctx.lineTo(x, y);
this.ctx.closePath();
this.ctx.stroke();
}
this.lastX = x; this.lastY = y;
},
InitThis() {
this.ctx = document.getElementById('myCanvas').getContext("2d");
console.log(this.ctx)
$('#myCanvas').mousedown(function (e) {
this.mousePressed = true;
this.testFunc();
this.Draw(e.pageX - $(this).offset().left, e.pageY - $(this).offset().top, false);
});
$('#myCanvas').mousemove(function (e) {
if (this.mousePressed) {
this.Draw(e.pageX - $(this).offset().left, e.pageY - $(this).offset().top, true);
}
});
$('#myCanvas').mouseup(function (e) {
this.mousePressed = false;
});
$('#myCanvas').mouseleave(function (e) {
this.mousePressed = false;
});
},
testFunc: function() {
console.log('testFunc');
},
didRender() {
console.log('eSignature didRender()');
this.InitThis();
},
actions: {
clearArea() {
// Use the identity matrix while clearing the canvas
this.ctx.setTransform(1, 0, 0, 1, 0, 0);
this.ctx.clearRect(0, 0, this.ctx.canvas.width, this.ctx.canvas.height);
}
}
});
Комментарии:
1. попробуйте
this.get('testFunc')()
вызвать метод TestFunc. еще один вариант, который вы можете перенести в actions hash и вызватьthis.send('testFunc')
2. Я получаю
this.get
иthis.send
не являются функциями3. О, извините
this
контекст неправильный .. кроме того, что вы делаете правильно, он должен работать
Ответ №1:
this
контекст неверен. Я бы посоветовал вам получить свойства компонента с помощью get
функции
var _this = this;
$('#myCanvas').mousedown(function (e) {
_this.set('mousePressed',true);
_this.testFunc();
_this.Draw(e.pageX - $(this).offset().left, e.pageY - $(this).offset().top, false);
});
Комментарии:
1. Спасибо! Я удивлен, что контекст меняется, так как отличается только область действия функции