尝试使用Vue.js访问堆栈Oveflow Api时出现错误

<template>
  <div>
    <h1>Stack Overflow Questions</h1>
    <ul v-if="questions.length">
      <li v-for="question in questions" :key="question.id">{{ question.title }}</li>
    </ul>
    <p v-else-if="error">Error: {{ error.message }}</p>
    <p v-else>Loading...</p>
  </div>
</template>

<script>
import { ref, onMounted } from 'vue';

export default {
  setup() {
    const questions = ref([]);
    const error = ref(null);

    onMounted(async () => {
      try {
        const response = await fetch('https://api.stackexchange.com/2.3/questions?order=desc&sort=activity&tagged=javascript&site=stackoverflow');
        if (!response.ok) {
          throw new Error(`HTTP error! status: ${response.status}`);
        }
        const data = await response.json();
        questions.value = data.items;
      } catch (err) {
        error.value = err;
      }
    });

    return { questions, error };
  }
};
</script>