如何在VUE 3组成API中使用已安装软件包的功能
我正在努力了解如何在第三方JavaScript库中使用VUE 3中使用功能。我正在尝试在我的VUE 3项目中使用交互式小说库igjs。我使用:NPM安装inkjs安装了它。我使用的是组成API。但是,我无法访问墨水中的功能。具体来说,这是不起作用的:
import { ref } from '@vue/reactivity'
import getStory from '../ink/story.js'
import { inkjs } from 'inkjs'
export default {
name: 'HomeView',
setup() {
const { storyContent } = getStory()
const story = new inkjs.Story(storyContent.value)
return { displayText, story }
}
}
故事是InkJS库中的主要功能。 它给出了此控制台错误:
HomeView.vue?43d0:29 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'Story')
at setup (HomeView.vue?43d0:29:1)
at callWithErrorHandling (runtime-core.esm-bundler.js?d2dd:155:1)
at setupStatefulComponent (runtime-core.esm-bundler.js?d2dd:7160:1)
at setupComponent (runtime-core.esm-bundler.js?d2dd:7114:1)
at mountComponent (runtime-core.esm-bundler.js?d2dd:5468:1)
at processComponent (runtime-core.esm-bundler.js?d2dd:5443:1)
at patch (runtime-core.esm-bundler.js?d2dd:5033:1)
at ReactiveEffect.componentUpdateFn [as fn] (runtime-core.esm-bundler.js?d2dd:5655:1)
at ReactiveEffect.run (reactivity.esm-bundler.js?89dc:185:1)
at instance.update (runtime-core.esm-bundler.js?d2dd:5689:1)
I'm struggling to understand how to use functions in Vue 3 from 3rd party JavaScript libraries. I am trying to use the interactive fiction library inkjs in my Vue 3 project. I installed it using: npm install inkjs. I am using the composition API. However, I cannot access the functions in inkjs. Specifically, this does not work:
import { ref } from '@vue/reactivity'
import getStory from '../ink/story.js'
import { inkjs } from 'inkjs'
export default {
name: 'HomeView',
setup() {
const { storyContent } = getStory()
const story = new inkjs.Story(storyContent.value)
return { displayText, story }
}
}
Story is the main function in the inkjs library.
It gives this console error:
HomeView.vue?43d0:29 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'Story')
at setup (HomeView.vue?43d0:29:1)
at callWithErrorHandling (runtime-core.esm-bundler.js?d2dd:155:1)
at setupStatefulComponent (runtime-core.esm-bundler.js?d2dd:7160:1)
at setupComponent (runtime-core.esm-bundler.js?d2dd:7114:1)
at mountComponent (runtime-core.esm-bundler.js?d2dd:5468:1)
at processComponent (runtime-core.esm-bundler.js?d2dd:5443:1)
at patch (runtime-core.esm-bundler.js?d2dd:5033:1)
at ReactiveEffect.componentUpdateFn [as fn] (runtime-core.esm-bundler.js?d2dd:5655:1)
at ReactiveEffect.run (reactivity.esm-bundler.js?89dc:185:1)
at instance.update (runtime-core.esm-bundler.js?d2dd:5689:1)
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
![扫码二维码加入Web技术交流群](/public/img/jiaqun_03.jpg)
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论