<div class="collection"> <el-button @click="toggleCollection">{{ isCollected ? '取消收藏' : '收藏' }}</el-button> </div> const isCollected = ref(false); // 是否已收藏 // 点击收藏按钮 async function collect() { try { // 调用收藏接口 await collectionKnowledge({ KNOWLEDGEID: detailContent.value.ID }); isCollected.value = true; // 更新状态 } catch (e) { console.error('收藏失败：', e); } } // 点击取消收藏按钮 async function cancelCollect() { try { // 调用取消收藏接口 await detelecollKnowledge({ knowledgeId: detailContent.value.ID }); isCollected.value = false; // 更新状态 } catch (e) { console.error('取消收藏失败：', e); } } // 切换收藏状态 function toggleCollection() { if (isCollected.value) { cancelCollect(); // 取消收藏 } else { collect(); // 收藏 } } //获取知识详情 const getKnowledge = async (params: KnowledgeGetQueryObj) => { const { RetCode, ReturnData } = await getKnowledgeApi(params); if (RetCode === 1001) { detailContent.value = ReturnData; } }; getKnowledge({ knowledgeId: query.id as string }); 如何实现点击收藏如果返回的RetCode：2004；则出现提示说该用户未登录，而且按钮还是收藏未改变，跳转登录页面；登录之后点击收藏之后，变成取消收藏，如果已经收藏了，刷新页面的状态还是取消收藏，不会刷新页面之后又将按钮变为初始状态

你可以在 `collect()` 和 `cancelCollect()` 函数中判断返回的 RetCode 是否为 2004，如果是则弹出提示，跳转到登录页面。同时，你可以在登录成功后再次调用 `getKnowledge()` 函数来刷新页面，确保收藏状态正确显示。

修改后的代码如下：

// 点击收藏按钮
async function collect() {
  try {
    // 调用收藏接口
    const res = await collectionKnowledge({ KNOWLEDGEID: detailContent.value.ID });
    if (res.RetCode === 2004) {
      // 用户未登录，弹出提示，跳转登录页面
      console.warn('用户未登录');
      // TODO: 跳转登录页面
      return;
    }
    isCollected.value = true; // 更新状态
  } catch (e) {
    console.error('收藏失败：', e);
  }
}

// 点击取消收藏按钮
async function cancelCollect() {
  try {
    // 调用取消收藏接口
    const res = await detelecollKnowledge({ knowledgeId: detailContent.value.ID });
    if (res.RetCode === 2004) {
      // 用户未登录，弹出提示，跳转登录页面
      console.warn('用户未登录');
      // TODO: 跳转登录页面
      return;
    }
    isCollected.value = false; // 更新状态
  } catch (e) {
    console.error('取消收藏失败：', e);
  }
}

// 切换收藏状态
function toggleCollection() {
  if (isCollected.value) {
    cancelCollect(); // 取消收藏
  } else {
    collect(); // 收藏
  }
}

//获取知识详情
const getKnowledge = async (params: KnowledgeGetQueryObj) => {
  const { RetCode, ReturnData } = await getKnowledgeApi(params);
  if (RetCode === 1001) {
    detailContent.value = ReturnData;
    isCollected.value = ReturnData.isCollection; // 更新收藏状态
  }
};
getKnowledge({ knowledgeId: query.id as string });

另外，需要在调用收藏接口成功后，更新返回的收藏状态，否则刷新页面之后按钮状态还是未收藏。你可以在 `getKnowledge()` 函数中，将返回的 `ReturnData.isCollection` 值赋给 `isCollected.value`，如上面代码所示。