Vue初體驗(一)

2022-01-31 21:49:44 字數 970 閱讀 4865

每個 vue 應用都需要通過例項化 vue 來實現。

語法格式如下:

varvm =newvue()

接下來讓我們通過例項來看下 vue 構造器中需要哪些內容:

可以看到在 vue 構造器中有乙個el 引數,它是 dom 元素中的 id。在上面例項中 id 為 vue_det,在 div 元素中:

<

div

id = "vue_det"

>

div>

這意味著我們接下來的改動全部在以上指定的 div 內,div 外部不受影響。

接下來我們看看如何定義資料物件。

data用於定義屬性,例項中有三個屬性分別為:site、url、alexa。

methods 用於定義的函式,可以通過 return 來返回函式值。

} 用於輸出物件屬性和函式返回值。

<

div

id="vue_det"

>

<

h1>site : }

h1>

<

h1>url : }

h1>

<

h1>}

h1>

div>

當乙個 vue 例項被建立時,它向 vue 的響應式系統中加入了其 data 物件中能找到的所有的屬性。當這些屬性的值發生改變時,html 檢視將也會產生相應的變化。

除了資料屬性,vue 例項還提供了一些有用的例項屬性與方法。它們都有字首 $,以便與使用者定義的屬性區分開來。例如:

vue的初體驗

詳細看vue的官方文件。此處記錄純屬個人在使用中的一些小結 1 v text 操作元素的純文字,其簡寫形式 eg 簡寫為 2 v html 其作用和v text一樣,唯一的區別是瀏覽器會將v html的資料當成html標籤解析後輸出 3 繫結事件用 v on click 標誌,v on 可簡寫為 4...

vue路由初體驗

這裡記一下,免得後面到處是錯 而且總是出錯,大部分是單詞打錯了,注意細節 新建乙個資料夾modules 裡面放router.js 在裡面import vue from vue 引入vue import index from comptents index index.vue 先引入等下要跳轉的模組 ...

vue 初識(概念 Vue初體驗)

1 vuejs 1 漸進式 可以將vue作為應用的一部分嵌入其中,例如 在重構的時候可以一點一點的進行 2 特點 解耦資料和檢視 可復用的元件 乙個元件可以在多個介面中使用 前端路由技術 狀態管理 虛擬dom 2 vuejs的安裝 方式一 cdn引入 利用的是網路資源,速度會降低 分為開發環境和生產...