Why doesn't it handle array reactivity in vue?

Question

Vue.js

Good afternoon.
Application on nuxt, there is an array (items I get through props):

<template>
<tr v-for="item in items" :key="item._id" @click="select(item)">
    <td>
      <input type="checkbox" v-model="item.checked">
    </td>
    <!--...-->
  </tr>
</template>

Below are different select options

<script>
  methods: {
    select1: function(item) {
      item.checked = !item.checked
    },

    select2: function(item) {
      this.$set(item, "checked", !item.checked)
    },

    select3: function(item) {
      this.$set(item, "checked", !item.checked)
      this.$set(this.items, item._id, item)
    },
    // еще был вариант с индексом, но не стал приводить
  }
</script>

All of them work ONLY on a page opened via ssr, for example, on domain.com?page=1, BUT if you go through pagination to page=2, they stop working (the checkbox is not updated, but console.log(item.checked) is correct )

Answer 1

Found. The problem was that originally "checked" was NOT added reactively. :)

Answer 2

As far as I understand, you give items to the props of the child component, and then you want to change them in the child component.
in that case https://ru.vuejs.org/v2/guide/components-props.htm...
"..you shouldn't try to change the prop inside a child component.."