Javascript .value пусто, когда я публикую на php используя axios / vue js

Question

У меня есть окно чата, а внизу у меня есть смайлы bb, которые, когда вы нажимаете на них, добавят смайлик к тексту, уже находящемуся в поле ввода.

Но когда я публикую сообщения с помощью axios, массив пуст, и если я вручную введу смайлик bbcode, он будет работать.

<input id="txtName" @keyup.enter="addMessage" v-model="txtInput" type="text" style="width:100%;height:40px;color:#000000;" placeholder="Type here and hit return">

<a style="cursor: pointer;" title="[smiley]" onClick="document.getElementById('txtName').value +='[smiley]'">
<img src="bb/images/smiley.gif"></img>
</a>  

axios.post('ajax/post.php', 
{ txtInput : this.txtInput }).then(function (response) {
console.log(response);

Answer 1

Не следует вручную обновлять значение ввода.

Вы должны добавить прослушиватель щелчков и изменить свойство v-модели

<a @click=“this.txtInput += ‘[smiley]’”

Примечание: вам не следует модифицировать DOM с помощью vanilla JS, а использовать методы, доступные для vue.