Todo list на Vue - Не могу решить вопрос с checbox "checked"

Ну история такая, реализация простого todo list, но все разбито на компоненты (Ну да это и не так важно). Вот пример) Вот что-то не могу придумать как это реализовать, чтобы статус checked, сохранялся у checkbox. На картинке видно, что после того как одной заметке поставлен статус completed он зачеркивается и Все сохраняется в Localstoreg. Но статус checkbox сбрасывается

Родитель ловит событие @confirm-todo="confirmTodo"

<div class="todo-body">
  <ul class="todo-body__list">
    <TodoElement
      v-for="(todo, i) of todos"
      :key="todo.id"
      :todo="todo"
      :index="i"
      @delete-todo="deleteTodo"
      @confirm-todo="confirmTodo"
    ></TodoElement>
  </ul>
</div>

Вот есть todo элемент

<template>
  <li class="todo-element">
    <span class="todo-info">
      <input type="checkbox" class="todo-check" @change="confirmTodo">
      <strong> {{ index + 1 }} :</strong>
      <p class="todo-text" :class="{done: todo.completed}">Title:  {{ todo.title }} </p>
    </span>
    <div>
      <Button class="todo-button__edit">
        <template>Edit</template>
      </Button>
      <FunctionsButton class="todo-button__delete" @click="deleteTodo">
        <template>Delete</template>
      </FunctionsButton>
    </div>
  </li>
</template>

Вот полетел $emit метод изменения статуса 'confirmTodo'

  methods: {
    deleteTodo () {
      this.$emit('delete-todo')
    },
    confirmTodo () {
      this.todo.completed = !this.todo.completed
      this.$emit('confirm-todo')
    }
  }

Ну и как говорил ранее что у родителя ловлю)) И делаю вот такую жесть с ним)) saveLocalStorageTodos() - Функция запись в LocalStorage

confirmTodo () {
      this.todos.includes({
        completed: true
      })
      this.saveLocalStorageTodos()
    }

Вот такие дела, хотелось бы как-то сохранять статус checkbox в localStorag, но не могу придумать как Разбередил примеры многих todo, но чет не смог примерить( как то нужно прикрутить watch походу, но опыта у меня совсем мало. Вот и тут уперся чет. Буду рад любой подсказке. Ну и если что, вот ссылка на репу: https://github.com/PIPSKVIK/My-todo Всем хорошего дня!!!


Ответы (0 шт):