vue加強(第二天)

2022-08-28 08:33:08 字數 1837 閱讀 1493

事件(v-on)

a)       表示式的兩種寫法

data:

i.           

這是乙個按鈕

ii.           

這是乙個按鈕

b)      

內聯事件的處理函式(事件裡面繫結乙個函式)

i.           

這是乙個按鈕

計算屬性和watch

a)      

計算屬性

i.毫秒值

},computed:

}})b)      

watch

i.           

定義:watch可以讓我們監控乙個值的變化。從而做出相應的反應。

ii.           

data:}元件

a)      

定義:元件是用來完成特定功能的自定義的html標籤

b)      

元件的分類

i.           

區域性元件:在自己的vue例項中它掛載的元素都有效

定義在vue物件裡面

new vue(}})

ii.           

全域性元件:在所有的vue的例項下面掛載的元素有效

new vue()

//全域性元件

a)      

vue.component(「mytag」,)

注意:1.templete模板裡面有且只能有乙個外部標籤。2.自定義標籤的命名不能駝峰命名方式,如果用了駝峰命名,在標籤上要使用「-」來表示mytag-->my-tag

模板標籤的內容不會顯示在頁面上

注意:templete如果寫在掛載容器裡面會直接顯示出來。

然後在templete:」#mytem」 引用templete就行了

在模板裡面使用資料特別注意:

標籤裡面寫form表單資料時,需設定type屬性為text/template才不會報錯

總結:模板裡面的屬性和方法,一定是從模板裡面去獲取

路由a)      

b)      

引入路由的js

to 表示要去找的路徑

最終會編譯成乙個a標籤

路由出口

打包指令碼(webpack)

a)      

優點i.           

提高**效率

ii.           

支援各種js語法

b)      

安裝webpack

i.           

全域性安裝

npm install -g webpack(可能會出錯,多試幾次)

npm install -g webpack-cli(安裝腳手架)

c)       

測試打包命令:webpack js/a.js –o dist/bundle.js

腳手架(vue-cli)

a)      

b)      

進入我們的專案目錄:cd 專案模組名稱

c)       

初始化腳手架:vue init webpack

d)      

執行npm run dev命令,就可以訪問我們的模組了

e)      

打包命令:將這個模組交給別人使用,npm run dev,打包之後只能在伺服器裡面執行。

f)       

重點關注:router/index.js和components/*.vue檔案

Vue筆記第二天

1.事件修飾符 v cloak可以隱藏鬍子語法 v once只渲染一次 prevent阻止預設跳轉 2.vue中的生命週期鉤子函式 beforemount 在dom渲染之前呼叫 mounted dom渲染完畢呼叫,這裡能訪問dom元素了 beforeupdate 資料發生改變,但是dom還沒變化之前...

vue的第二天

輸入關鍵字搜尋 刪除 foreach,some,filter,findindex屬於新陣列方法 indexof item 1屬於包含,item.name.includes 也屬於包含,有就返回true 根據關鍵字搜尋,1.使用foreach,some,filter,findindex來遍歷陣列 2....

Vue學習(第二天)

開啟vscode,通過檢視 終端開啟終端,準備建乙個vue專案。開啟乙個目標資料夾,終端給命令 npm install g vue cli建立乙個專案 vue init webpack projectname cnpm install global vue cli 這個比上面更快一點 在這裡發現報錯...