As a newcomer to Vue.js, I have a question regarding calling functions from a custom JavaScript file within a Vue component. Here is what I attempted:
custom.js
class API{
function testCall(){
alert("test ok");
}
}
export {API}
App.vue
<template>
<div id="app">
<img src="./assets/logo.png">
<HelloWorld msg="Welcome to Your Vue.js App"/>
<testcomponent :on-click="getData">
</testcomponent>
</div>
</template>
<script>
import HelloWorld from './components/HelloWorld.vue';
import TestComponent from './components/TestComponent.vue';
import API from './js/custom.js';
export default {
name: 'app',
components: {
HelloWorld,
TestComponent,
API
},
methods: {
getData(){
const apiObj = new API();
apiObj.testCall();
}
}
}
</script>
After running npm run build
, I encountered the following error message:
https://i.sstatic.net/F8OWJ.png
If anyone could provide assistance with this issue, I would greatly appreciate it.