我有一個(gè)非?；镜?HTML 頁(yè)面，其中有一個(gè)簡(jiǎn)單的 Vue 組件。在網(wǎng)絡(luò)選項(xiàng)卡中，我可以看到它正確獲取了數(shù)據(jù)，應(yīng)該出現(xiàn)的列表已呈現(xiàn)，但數(shù)據(jù)根本不存在。    <div id="app">      <h2>Total inventory: {{ totalProducts }}</h2>      <ul>        <li>beginning of the list</li>        <li v-for="product in products">          {{ product.name }} {{ product.price }}        </li>        <li>End of the list</li>      </ul>    </div>    <script src="https://unpkg.com/vue"></script>    <script>      const app = new Vue({        el: '#app',        data: {          products: []        },        created () {          fetch('http://localhost:3000/api/teddies')            .then(response => response.json())            .then(json => {              this.products = json.products            })        },        computed () {          return this.products.reduce((sum, product) => {            return sum + product.quantity          }, 0)        }      })    </script>我嘗試將腳本的代碼包含到一個(gè)單獨(dú)的文件中，使用 axios 進(jìn)行請(qǐng)求（我知道它不會(huì)改變?nèi)魏问虑?，因?yàn)檎?qǐng)求實(shí)際上已經(jīng)有效），將 ID 直接歸因于列表并在腳本中使用它...沒(méi)有出現(xiàn)任何內(nèi)容來(lái)代替 {{ Product.name }} 和 {{ Product.price }} 。同樣適用于totalProducts變量和{{totalProducts}}