<span>{{ itemInfo }}</span><div v-for="item in itemInfoList" :key="item" @click="checked(item, itemInfo)">{{ item }}</div><span>{{ sortInfo }}</span><div v-for="item in sortList" :key="item" @click="checked(item, sortInfo)">{{ item }}</div><script setup>const itemInfoList = ref(["全部项目", "已加入", "未加入"]); let itemInfo = ref(itemInfoList.value[0]); //排序数据 const sortList = ref(["创建时间倒序", "创建时间正序", "项目名称倒序", "项目名称正序"]); let sortInfo = ref(sortList.value[0]);function checked(item, target) { target.value = item; }<script>checked方法需要复用，该怎么写

你可以将`checked`方法定义在`setup`区块外部，然后在`setup`区块内部引用它，以实现复用。以下是示例代码：

<template>
  <div>
    <span>{{ itemInfo }}</span>
    <div v-for="item in itemInfoList" :key="item" @click="checked(item, itemInfo)">{{ item }}</div>
    <span>{{ sortInfo }}</span>
    <div v-for="item in sortList" :key="item" @click="checked(item, sortInfo)">{{ item }}</div>
  </div>
</template>

<script setup>
import { ref } from 'vue';

const itemInfoList = ref(["全部项目", "已加入", "未加入"]);
const itemInfo = ref(itemInfoList.value[0]);

const sortList = ref(["创建时间倒序", "创建时间正序", "项目名称倒序", "项目名称正序"]);
const sortInfo = ref(sortList.value[0]);

// 复用的 checked 方法
function checked(item, target) {
  target.value = item;
}
</script>

在上述代码中，我们将`checked`方法定义在了`<script setup>`之外，然后在`<script setup>`内部通过直接引用来使用它。这样就可以在不同的地方复用该方法了。