Creo algunas casillas de verificación dinámicas con vue y se ven así;

 <li v-for="element in checklist" :key="element.id" class="block w-full p-1"> <div v-if="element.taskId == task" class="w-full border-2 rounded-md p-4"> <div class="float-right"> <button @click="deleteCheck(element.id)"> <Trash2Icon class="px-1"/> </button> </div> <div class="flex"> <input type="checkbox" id="checkbox" v-model="element.checked" class="w-6"> <label for="checkbox" class="px-2">{{element.content}}</label> </div> </div> </li>

Quiero ver el valor "element.checked" con la función watch() en vue y quiero publicarlo en la API usando axios . y se ve tal vez así;

 watch: { element.checked() { // doesn't work axios.put('api/blabla' + element.id, // I'm not sure here, I'm just trying to compare checked: this.element.checked }) .catch(err => { console.log(err) }) } }

Solo estoy buscando un método, podría ser diferente. el código anterior es solo un elemento de suposición. La verificación da un error.

por cierto, mi lista de verificación parece;

 "checklist": [ { "content": "lorem ipsum dolor", "checked": true, "id": 1 }, { "content": "lorem ipsum dolor sit", "checked": false, "id": 2 }, ]```