110
rated 0 times
[
114]
[
4]
/ answers: 1 / hits: 60638
/ 8 Years ago, sun, october 9, 2016, 12:00:00
I am loading a template that references a client side js file with my code like so:
<!DOCTYPE html>
<html>
<head>
<script src=https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.1/vue.js></script>
<link rel=stylesheet type=text/css href=../css/app.css>
</head>
<body>
<div id=container>
<div id=map>
<script src=../js/app.js type=text/javascript></script>
<div id=offer-details>
<form id=offer-form v-on:submit=makeOffer(tags, description, code)>
<input id=description/>
<input id=tags/>
<input id=code/>
<input type=submit/>
</form>
</div>
</div>
</div>
</body>
</html>
My browser shows that the following (details.js) loads successfully.
var vm = new Vue({
el: #details,
data: {
offer: {
publickey: '',
privatekey: '',
name: '',
service: '',
value: '',
currency: '',
tags: '',
description: '',
code: ''
},
methods: {
makeOffer: function makeOffer(){console.log(vm.publickey)}
}
}
})
However, when I submit the form I get the following error message:
[Vue warn]: Property or method makeOffer is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option. (found in root instance)vue.js:2574:7
[Vue warn]: Handler for event submit is undefined.
It looks to me like I'm defining makeOffer in the method key as I should. Is this not the same as defining it on the instance? Why isn't it seeing makeOffer?
More From » vue.js