Vue.js 在哪里存儲非組件數據屬性？

Question

我正在使用 Vue.js 開發一個項目，並且我大部分時間都使用組件，但有時我只想添加一些 Vue.js 語法而不完全創建組件。

因為我不像你通常那樣使用渲染，所以 Vue 附加到的整個 HTML 內容不會被覆蓋，所以我可以在現有 HTML 上添加一些sprinkle語法。

new Vue({
    el: '#vue',
    name: 'Vue root',
    data: {
      store
    },
    components: {
        Example
    }
});

將一些 Vue.js 語法添加到現有 HTML 的示例是： 保持 2 個輸入彼此同步，例如：

index.html 上的表格一

<input type="text" attributes... v-model="store.arrival">

index.html 上的表格二

<input type="text" attributes... v-model="store.arrival">

在介紹這家商店之前，我收到一條消息，內容大致如下：

[Vue 警告]：屬性或方法“到達”未在實例上定義，但在渲染期間被引用。 確保在 data 選項中聲明反應數據屬性。 （在根實例中找到）

這導致我介紹了這個商店，因為我不想讓我的根組件的數據屬性在那個文件中膨脹，而是保留這些floating in space(because they do not belong to a component)屬性。

我喜歡仍然將 Vue 語法添加到現有 HTML 的能力，但這感覺像是不好的做法。

有沒有比在商店里更好的方法來存儲這些變量（它會很快變得擁擠）？ 還是我實際上應該將所有內容都移動到組件中？ 這也會導致問題，因為如果我需要它們，我被迫將 PHP 變量之類的東西轉換為 Javascript。

希望我的意思很清楚，感謝您的閱讀，如果您需要更多信息，請告訴我。

干杯。

Answer 1

從您的問題看來，您覺得自己做錯了什么是通過使用 Vue 的 data 屬性而不是組件，或者通過將 Vue 指令添加到存在於 Vue 元素內的 HTML。

這沒有什么問題。 Vue 文檔的入門頁面就是這樣做的。 這是開始將 Vue 與各種 Web 框架集成的便捷方式。 我認為沒有人認為這是一種不好的做法。 如果有人這樣做，那么，誰在乎呢？