useLocalObservable cannot deeply observe changes in arrays and objects

[matcv123]

<template>
  <div>
    <h1 class="count" v-text="state.list.length" />
    <h1 class="count" v-text="state.obj.count" />
    <button @click="state.increment">+</button>
  </div>
</template>

<script setup lang="ts">
import { useLocalObservable, observable } from 'mobx-vue-lite';

const state = useLocalObservable(() => ({
  list: [],
  obj: { count: 0 },
  increment() {
    this.list.push(1);
    this.obj.count++;
  },
}));
</script>

When I click the button, the view does not update automatically.

I am not sure if the useLocalObservable function itself does not have the ability to deeply listen, or if there is an error in my code, but the program is not running as expected. I am looking forward to receiving a response, thank you.

[wobsoriano]

Fixed in v0.4.3