一、引入 Vue 文件

<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>

二、定義一個容器

<!--root 容器里的代碼稱為 Vue模板;VueProject 實例和容器是一一對應(yīng)的；真實開發(fā)中只有一個 Vue 實例，并且會配合著組件一起使用； --> <div id="root"><!-- {{xxx}} 中的 xxx 要寫 js 表達(dá)式，且 xxx 可以自動讀取到 data 中的所有屬性；一旦 data 中的數(shù)據(jù)發(fā)生改變，那么頁面中用到該數(shù)據(jù)的地方也會自動更新；注意區(qū)分：js 表達(dá)式和 js 代碼（語句）1. 表達(dá)式：一個表達(dá)式產(chǎn)生一個值，可以放在任何一個需要值的地方(1). a(2). a + b2. js 代碼（語句）(1). if () {};(2). for () {};--><p>{{1 + 1}}</p><p>{{a > b ? true : false}}</p> </div>

三、創(chuàng)建 Vue 實例

new Vue({el: '#root', // el === document.querySelector()data() { // data 中存儲數(shù)據(jù)，數(shù)據(jù)供 el 所指定的容器去使用return {name: '張三'}}, }) Vue.config.productionTip = false; // 關(guān)閉瀏覽器控制臺的生產(chǎn)提示

總結(jié)

以上是生活随笔為你收集整理的vue初始的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。