每当我试图向正确的方向移动桨时，我都会收到此错误！
未捕获的TypeError：paddle.moveRight不是HTMLDocument.InputHandler.document.addEventListener.event中的函数
//index.HTML
<html>
<head>title>Brick Breaker</title
><meta charset="UTF-8" />
</head>
<body>
<canvas id="gameScreen" width="800" height="600"></canvas>
<script type="module" src="src/index.js"></script>
</body>
</html>
//index.就是
import Paddle from './paddle.js'
import InputHandler from './input.js'
let canvas = document.getElementById("gameScreen");
let ctx = canvas.getContext("2d");
let paddle = new Paddle();
new InputHandler(Paddle)
function gameLoop() {
ctx.clearRect(0, 0, 800, 600);
paddle.update();
paddle.draw(ctx);
requestAnimationFrame(gameLoop);
}
gameLoop()
//paddle.就是
export default class Paddle {
constructor(){
this.width=150;
this.height=30;
this.maxSpeed =10;
this.speed=0;
this.position={
x:300,
y:500
}
}
moveRight() {
this.speed = this.maxSpeed;
}
draw(ctx) {
ctx.fillStyle = "#0ff";
ctx.fillRect(this.position.x, this.position.y, this.width, this.height);
}
update() {
this.position.x += this.speed;
}
}
//input.就是
export default class InputHandler {
constructor(paddle) {
document.addEventListener("keydown", event => {
if(event.keyCode ==37)
paddle.moveRight();
});
}
}
当我按下右箭头按钮时，拨片应该向右移动
let paddle = new Paddle();
new InputHandler(Paddle)
您正在将Paddle类传递给InputHandler的构造函数。然后你在那个班级上调用moveLeft。
你可能想要传入类的实例。
let paddle = new Paddle();
new InputHandler(paddle);