I'm not sure what's happening here, but I'm calling a function in Vue upon button click, and it makes an axios call but the issue is that no matter what I type in the textarea (v-model taskCommentBody) it sends the data commentBody as blank.
What am I doing wrong here?
<div class="form-group row">
<textarea v-model="taskCommentBody" class="form-control col" rows="6" placeholder="What do you have to say about this task?" name="task-comment"></textarea>
</div>
<button v-on:click="saveTaskComment" role="button" class="btn btn-primary" type="submit">
Save Comment
</button>
/**/
saveTaskComment() {
axios.post('/task/comment/save', {
commentBody: this.taskCommentBody
})
.then((response) => {
// handle success
this.comments.unshift(response.data.content);
})
.catch(function (error) {
// handle error
})
.finally(() => {
this.$root.taskCommentBody = '';
});
}
See Question&Answers more detail:os