Vue中关于响应式的一个问题_vue success(res) 语法-优快云博客

本文链接：https://blog.youkuaiyun.com/shengbeer/article/details/87739635

在使用Vue构建一个类似京东生鲜的网页时，遇到v-for无法渲染的问题。通过分析，发现是由于数据加载发生在DOM构建之后，导致Vue无法响应。解决方案包括在Vue实例创建前获取数据或将数据加载放在created钩子中，确保数据变更能被Vue追踪并更新视图。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近在参加一个面试，对方发了一套面试题过来；要求是做一个类似京东生鲜的网站，要求实现商品列表功能；之前我一直都是在vue-cli脚手架中使用vue；由于这个页面比较少，所以直接引入的CDN但是却发现不能进行v-for渲染了。下面是我的错误代码

<!DOCTYPE html>
<html>

   <body>
           <div id="link-tab" >
               <div class="tab-list" v-for="item in goodsdata">
                   <a class="goods-show">
                       <div class="goods-pic">
                           <img v-bind:src="item.imgurl" alt="fruit-picture"/>
                       </div>
                       <div class="goods-info">
                           <div class="goods-title">{ {item.title}}</div>
                           <div class="goods-price">
                               <div class="price">
                                   <span>￥{ {item.price}}</span>
                               </div>
                               <div class="sale-price">
                                   <span>￥{ {item.salePrice}}</span>
                               </div>
                           </div>
                           <div class="goods-evalution">