[英]Trouble exporting and Importing Vanilla Javascript Class Object into Vue.js app, element not defined error
I am currently working on a game project.我目前正在做一个游戏项目。 The main structure will be done using game objects based on javascript classes with constructors.
主要结构将使用基于带有构造函数的 javascript 类的游戏对象来完成。 I have done it in plain Javascript and Html, but when trying to port it to Vue.js I have problems importing and using objects.
我已经在普通的 Javascript 和 Html 中完成了它,但是在尝试将其移植到 Vue.js 时,我在导入和使用对象时遇到了问题。 The import is working fine, the problem is that I have a property this.element = element.config and error says element is not defined (though in simple javascript it is working fine).
导入工作正常,问题是我有一个属性 this.element = element.config 并且错误说元素未定义(尽管在简单的 javascript 中它工作正常)。 Hope you can explain some of that stuff and suggest me changes to make it work.
希望您能解释其中的一些内容并建议我进行更改以使其正常工作。
Here is my Javascript class object:这是我的 Javascript class object:
export default class World { constructor(config) { this.element = element.config this.canvas = this.element.getElementById('game__canvas') this.ctx = this.canvas.getContext('2d') } init() { console.log('Hi, It is working!', this) } }
Here is the code that tries to launch it in my Vie.js app:这是尝试在我的 Vie.js 应用程序中启动它的代码:
import World from './World' // First I import it like that from an external file mounted() { this.gameUpdate() }, methods: { updateGame() { const world = new World({ element: document.querySelector('#game__container') }) world.init() } }, // gives me Uncaught (in promise) ReferenceError: element is not defined
are you sure is你确定是
this.element = element.config
and not并不是
this.element = config.element
? ?
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.