Sunday, May 12, 2024
 Popular · Latest · Hot · Upcoming
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

 Answers
14

You want to make sure makeOffer is inside the methods option (which itself is outside the data option). Right now you have the methods option inside the data option. Also, you can't log the publickey using vm.publickey; instead, you should use this.offer.publickey.


[#60459] Thursday, October 6, 2016, 8 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
zoiel

Total Points: 692
Total Questions: 90
Total Answers: 89

Location: Rwanda
Member since Thu, Feb 10, 2022
2 Years ago
;