vue3+ts 在mitt 中 ref数组更新数据 无法更新视图

在Vue 3 + TypeScript中，如果你使用了`ref`来声明一个数组，并且在`mitt`事件中更新了该数组的值，但是视图没有更新，可能是因为Vue无法检测到数组的变化。Vue只能追踪`ref`对象本身的变化，而不能追踪`ref`对象内部属性的变化。

为了解决这个问题，你可以尝试使用`reactive`函数来声明一个响应式的对象，然后将数组作为该对象的属性来更新数据。这样Vue就能够正确地追踪数组的变化并更新视图。

下面是一个示例：

import { reactive } from 'vue'

// 声明一个响应式的对象
const data = reactive({
  listData: [] as any[]
})

mitt.on(changeListenerName, (data: any) => {
  const { selectedItems } = data

  if (selectedItems) {
    // 更新数组属性
    data.listData.push(selectedItems)
  }

  mitt.off(changeListenerName)
})

通过将数组作为`data`对象的属性来更新数据，Vue将能够正确地追踪数组的变化并更新视图。

请注意，以上示例中的`data.listData`是一个普通的数组，不需要使用`ref`函数来进行声明。而整个`data`对象是通过`reactive`函数来声明的，以使其成为一个响应式的对象。

使用这种方式来更新数组数据后，你应该能够正确地触发视图的更新。