vue2+three.js 实现键盘“wasd“前后左右移动

变量说明：

movementSpeed：移动速度

movementSpeed: 0.1, // 相机移动速度

camera：相机实例

 // 创建相机
      this.camera = new THREE.PerspectiveCamera(
        this.fov,
        window.innerWidth / window.innerHeight,
        this.near,
        this.far
      );

代码：

1、移动方法

toggleFullscreen(event) {
      switch (event.code) {
        case "KeyW":
          this.camera.translateZ(-this.movementSpeed); // 向前移动
          break;

        case "KeyA":
          this.camera.translateX(-this.movementSpeed); // 向左移动
          break;

        case "KeyS":
          this.camera.translateZ(this.movementSpeed); // 向后移动
          break;

        case "KeyD":
          this.camera.translateX(this.movementSpeed); // 向右移动
          break;

        default:
          break;
      }
    },

2、开启键盘监听

  mounted() {
    this.init3D();
    window.addEventListener("keydown", this.toggleFullscreen, true);
  },

3.销毁监听

destoryed() {
    window.removeEventListener("keydown", this.toggleFullscreen, false);
  },