vue3+ts删除怎么写

在Vue 3中使用TypeScript删除操作可以按照以下步骤进行：

1. 首先，确保已经安装了`vue`和`@vue/cli`，以及`typescript`。可以使用以下命令进行安装：

npm install -g @vue/cli
vue create my-project
cd my-project

2. 创建一个Vue组件，例如`MyComponent.vue`，并在其中定义一个数组：

<template>
  <div>
    <ul>
      <li v-for="(item, index) in items" :key="index">
        {{ item }}
        <button @click="deleteItem(index)">Delete</button>
      </li>
    </ul>
  </div>
</template>

<script lang="ts">
import { defineComponent, reactive } from 'vue';

export default defineComponent({
  name: 'MyComponent',
  setup() {
    const items = reactive(['Item 1', 'Item 2', 'Item 3']);

    const deleteItem = (index: number) => {
      items.splice(index, 1);
    };

    return {
      items,
      deleteItem,
    };
  },
});
</script>

3. 在上面的代码中，我们使用了`reactive`来声明一个响应式的`items`数组。然后，我们定义了一个`deleteItem`方法，在点击按钮时调用该方法来删除数组中的元素。

4. 最后，在父组件中使用`MyComponent`组件：

<template>
  <div>
    <h1>My App</h1>
    <MyComponent />
  </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue';
import MyComponent from './MyComponent.vue';

export default defineComponent({
  name: 'App',
  components: {
    MyComponent,
  },
});
</script>

通过上述步骤，你可以在Vue 3中使用TypeScript来实现删除操作。当点击按钮时，对应的数组元素将会被删除。