Pinia 响应式丢失

[Joyce-wen]

我在使用Pinia时 使用了 storeToRefs 进行包裹 但是好像还是丢失了响应式

// Pinia
import type { Naire, QuestionOption } from '@/interfaces';
import { http, type ReturnDto } from '@/utils';
import { defineStore } from 'pinia';
import { v4 as uuidv4 } from 'uuid';
import { onMounted, ref, watch } from 'vue';
export const useQuestionNaireStore = defineStore('questionnaire', () => {
  const naireId = ref<string>('65431135a4eb9c0656e2d9b4');
  const isUpdate = ref<Boolean | null>(null);
  const naire = ref<Naire>({
    _id: '',
    title: '问卷标题',
    explain: '问卷说明',
    thank_info: '谢谢参与',
    isShow_number: true,
    isSubmit: false,
    questions: [
      {
        q_id: uuidv4(),
        q_title: '问题标题',
        q_explain: '',
        q_type: 'radio',
        insert: '',
        required: true,
        random: false,
        options: [
          { o_id: uuidv4(), o_label: '选项', o_explain: '', light: false, no_random: false, insert: '', group: '' },
          { o_id: uuidv4(), o_label: '选项', o_explain: '', light: false, no_random: false, insert: '', group: '' },
        ],
      },
      {
        q_id: uuidv4(),
        q_title: '问题标题',
        q_explain: '',
        q_type: 'singleblank',
        insert: '',
        required: true,
        min_length: 0,
        max_length: 0,
        regex: '',
        placeholder: '请输入',
      },
    ],
  });
  // 选中项
  const isActiveItem = ref<string>('');
  // 是否批量编辑
  const isBatchAdd = ref<boolean>(false);
  // 设置Bar 控制
  const tabPane = ref<string>('naireSetting');
  // 题目类型选项
  const questionOptions = ref<QuestionOption[]>([
    {
      label: '单选',
      value: 'radio',
      icon: 'RadioButtonOn',
      default: {
        q_id: uuidv4(),
        q_title: '问题标题',
        q_explain: '',
        q_type: 'radio',
        insert: '',
        required: true,
        random: false,
        options: [
          { o_id: uuidv4(), o_label: '选项', o_explain: '', light: false, no_random: false, insert: '', group: '' },
          { o_id: uuidv4(), o_label: '选项', o_explain: '', light: false, no_random: false, insert: '', group: '' },
        ],
      },
    },
    {
      label: '单项填空',
      value: 'singleblank',
      icon: 'Select',
      default: {
        q_id: uuidv4(),
        q_title: '问题标题',
        q_explain: '',
        q_type: 'singleblank',
        insert: '',
        required: true,
        min_length: 0,
        max_length: 0,
        regex: '',
        placeholder: '请输入',
      },
    },
  ]);

  const saveNaire = async () => {
    if (!naire.value._id) delete naire.value._id;
    const response = (await http.post<ReturnDto<string>>('/api/questionnaire/save', naire.value)) as ReturnDto<string>;
    if (response.status === 0) {
      naireId.value = response.result;
      isUpdate.value = false;
    }
  };

  const getNaireDetail = async () => {
    if (!naireId.value) return;
    const response = (await http.get<ReturnDto<Naire>>(`/api/questionnaire/Detail?_id=${naireId.value}`)) as ReturnDto<Naire>;
    if (response.status === 0) {
      naire.value = response.result;
    }
  };

  const upateActiveItem = (item: string) => {
    isActiveItem.value = item;
  };

  watch(isActiveItem, (newValue) => {
    if (newValue) isBatchAdd.value = false;
    if (newValue === 'naire-title' || newValue === 'naire-explain') tabPane.value = 'naireSetting';
    else if (newValue !== 'naire-title' && newValue !== 'naire-explain') {
      tabPane.value = 'questionSetting';
    }
  });

  watch(
    naire,
    () => {
      if (isUpdate.value === null) {
        isUpdate.value = false;
      } else isUpdate.value = true;
    },
    { deep: true },
  );

  onMounted(() => {
    getNaireDetail();
    setInterval(() => {
      saveNaire();
    }, 180000);
  });

  return { naire, isActiveItem, isBatchAdd, tabPane, questionOptions, isUpdate, saveNaire, getNaireDetail, upateActiveItem };
});

const questionNaireStore = useQuestionNaireStore();
const { naire, isActiveItem, isUpdate, tabPane } = storeToRefs(questionNaireStore);
// 删除题目
const deleteQuestion = (q_id: string): void => {
  console.log('isActiveItem :>> ', isActiveItem);
  const deleteIndex = naire.value.questions.findIndex((item) => item.q_id === q_id);
  if (deleteIndex !== naire.value.questions.length - 1) {
    // isActiveItem.value = naire.value.questions[deleteIndex + 1].q_id;
    questionNaireStore.upateActiveItem(naire.value.questions[deleteIndex + 1].q_id);
  } else {
    // isActiveItem.value = naire.value.questions[deleteIndex - 1].q_id;
    questionNaireStore.upateActiveItem(naire.value.questions[deleteIndex - 1].q_id);
  }
  console.log('isActiveItem.value :>> ', isActiveItem);
  naire.value.questions = naire.value.questions.filter((item) => item.q_id !== q_id);
};

[Joyce-wen]

求大佬们帮看看，感谢任何一个回复🙏