我试着找出为什么会发生这种情况，但我不知道为什么。我将张贴代码，然后解释发生了什么。问题是我不知道为什么会发生这种情况，这是恼人的我像疯了！
按钮：

<a
  href="#"
  v-for="(userStories, userStoriesIndex) in storiesData"
  :key="userStoriesIndex"
  @click="openUserStories(userStoriesIndex)"
>

其中加载：

<Stories v-for="(userStories, userStoriesIndex) in storiesData" 
  :key="userStoriesIndex"
>
  <Story v-for="(story, storyIndex) in userStories.stories" 
    :key="storyIndex"
    user-link="#"
    :name="userStories.model.name"
    :date="story.created_at"
    close-button
    @closeButtonClick="onCloseButtonClick"
  >
    <template #avatar>
       <img :src="userStories.model.profile_photo_path" />
    </template>
    <img :src="story.media.preview_url" />
  </Story>
</Stories>

storiesData是从这个方法载入的：

getStories() {
  axios
    .get("/stories")
    .then((response) => (this.storiesData = response.data));
}

在mounted()期间加载
将其加载到：

data() {
        return {
            storiesData: [],

现在，当我单击按钮时，模型加载不完整，它没有加载数据...但是...这就是我丢失数据的地方...
如果我从Axios请求中获取数据，将其转换为JS对象，并将其添加到Vue文件中，则一切都按预期工作。
我不知道发生了什么。我完全不知道为什么local可以工作而Axios不行。数据是相同的，包括但不限于查看Vue DevTools。