pinia 怎么让对象里面的属性也是响应式的

Pinia是Vue 3官方推荐的状态管理模式，它基于Vue.js的响应式系统，通过Vuex的思想实现了更轻量级的模块化状态管理。当我们在Pinia中创建一个store并定义了一些数据属性时，这些属性默认会被视为响应式的。

当你在store中定义的数据通过getter、action或mutations修改时，Pinia会利用Vue的`reactive`函数来包装这些数据，使其自动跟踪依赖，并在数据变化时通知视图更新。只要store实例作为组件的局部依赖注入，那么这些响应式数据的变化就会自动触发组件内的`setup`生命周期钩子进行更新。

例如：

import { createStore } from 'pinia';

const store = createStore({
  state: () => ({
    count: 0,
  }),
  getters: {
    doubleCount(state) {
      return state.count * 2;
    },
  },
  actions: {
    increment(context) {
      context.commit('increment');
    },
  },
  mutations: {
    increment(state) {
      state.count++;
    },
  },
});

export default store;

// 使用时，在组件的setup方法里注入store
setup() {
  const { count, increment } = useStore(store); // inject store and its methods

  // count已经是响应式的，每次increment调用都会更新count
  onMounted(() => {
    increment();
  });
}

在这个例子中，`count`属性的变化会使得整个组件自动更新，因为它们都是由Pinia包裹后的响应式对象。