I have two Vue.js components Lobby and Game. My goal is to utilize Game as a model that holds all the necessary logic for creating a game, which can then be triggered through interactions in the Lobby component.
Whenever I try to run the application and click on the button, it results in the following error:
Uncaught TypeError: game.createGame is not a function
at click (eval at createFunction (vue.js:9923), <anonymous>:2:76)
at HTMLButtonElement.invoker (vue.js:1827)
I'm seeking guidance on how to properly access the game method from within the Lobby component. Any help would be greatly appreciated! Thanks!
let Game = {
methods: {
createGame: function () {
console.log('createGame clicked')
}
}
}
let Lobby = {
template: `
<div>
<button v-on:click="game.createGame()">Create</button>
</div>
`,
data() {
return {
'game': Game
}
},
}