Vue submit button data
Suppose I had this code
<main>
<form>
<input type="text" v-model="name">
<button type="submit" @click="submit">
Submit From Vue Property
</button>
</form>
</main>
And this is the Vue code.
new Vue({
el : 'main',
data : {
name : ''
},
methods : {
submit(){
}
}
})
how to send to server from Vue data property? This is what I used in the submit method.
(to be honest, my actual code is very complex, but the problem is the same. How do I pass a Vue data property instead?)
+3
source to share
1 answer
If you are looking for an ajax based solution, consider using a library called axios '. It allows you to send / receive data using urls like jquery get and post methods.
To use axios, you need to first install axios with npm npm install axios --save
, import it with import axios from axios
and use it in submit. The new code will look like this:
<main>
<form @submit.prevent="submit">
<input type="text" v-model="name">
<button type="submit">
Submit From Vue Property
</button>
</form>
</main>
new Vue({
el : 'main',
data : {
name : ''
},
methods : {
submit(){
axios.post('/your-url', {name: this.name})
.then(res => {
// do something with res
})
.catch(err => {// catch error});
}
}
})
+3
source to share