After retrieving a list of debits and credits from a server using the fetch function, I store them in my Vue application:
const myApp = Vue.createApp({
data(){
return{
debits:[],
credits:[],
//cut
}
},
methods:(
fetch(myUrl,this.myInit)
.then(response => response.json())
.then(data => {
this.credits = data.opes.credits,
this.debits = data.opes.debits
})
To display these entries, I use text input fields instead of contenteditable with vue.js. Each line contains an id and content (intitule). When the content changes, I need to send both the id and content to a method in vuejs.app.js file, preferably using a watch, which then sends the updated information to the server. This is how it looks in the template:
<div v-for="ligne in credits"
:debits="ligne"
:key="ligne.id"
class="ligne_entree"
:id="'ligne_' + ligne.id">
<input type="text" v-model="ligne.intitule" :id="'intitule_' + ligne.id">
</div>
Currently, I try to watch for changes like this:
watch:{
'debits.intitule': function(value){
console.log(watch, value)
}
}
However, I am not receiving any error messages and nothing seems to be happening as expected.