Imagine you're working on a VueJS project and have a HelloWorld.js file structured as follows:
export default {
addNumbers: function (a,b) {
return a+b;
}
}
You then utilize this in your HelloWorld.vue file like so:
<template>
<div>
<h1>{{addNumbers(1,2)}}</h1>
</div>
</template>
<script>
import helloWorldJS from './HelloWorld.js'
export default {
name: 'HelloWorld',
methods: {
addNumbers: function(a,b) {
return helloWorldJS.addNumbers(a,b);
}
}
}
</script>
The struggle arises from having to replicate the addNumbers function within the methods section of the HelloWorld component.
Is there an efficient method to make the external addNumbers function accessible from the template section?