I'm trying to learn Vue.js and was following the official guides. On the Reactivity Fundamentals tutorial I found out that the state, which is initialized as a reactive variable, is declared as a constant. Why are they doing this and why is this working?

<script setup>
import { reactive } from 'vue'

const state = reactive({ count: 0 })

function increment() {
  state.count++
}
</script>

<template>
  <button @click="increment">
    {{ state.count }}
  </button>
</template>