在html中使用vue元件

2022-09-22 01:03:09 字數 827 閱讀 1744

最近在維護公司的專案,當我拿到專案時,發現他用了vue。

但是~~僅僅是引用vue.js檔案,整體的架構還是html那種,沒有用webpack!

當時覺得~哇~原來還可以這樣!

然後了解了業務邏輯和**邏輯,覺得這個人寫的~emmm~~~,沒辦法只能按照之前的思路去寫~

開發新頁面時,我就引用了vue的元件(上個人僅僅是用到了雙向繫結這個好處),

下面附上在html中引用vue元件的寫法:

第一步:首先引用 httpvueloader.js, 再引用vue.use(httpvueloader)---這步很重要

第二步:建立vue元件,引用vue元件

第三步:在html中寫引用元件,就ok啦

ps:在引用元件時,中途出現了小插曲。從第二步可以看出我的元件名起的是addinfo.

我一開始在html中引入時直接寫成,怎麼都顯示不了元件!後來才知道,vue2.0元件命名區分大小寫了,哈哈哈哈~

在這裡就不細說了,有時間會專門寫一篇關於命名規則的~

新手上道,寫的不足的地方請大家提出來哦~~

Vue 在元件中使用 v model

參考 自定義事件 custom event 還可以用來建立出 實現 v model 機制的自定義輸入框 custom input 回顧前面章節中 等同於如下 而用於乙個元件時,v model 則可以替換為如下 為了元件內部能夠有效執行,元件內的 必須 將 value 屬性繫結到 value prop...

在vue中使用iframe 引用HTML頁面

在vue中引入iframe設定src屬性 兩種方式 使用絕對路徑 例如 使用相對路徑 要引入的檔案放在public下 src ofd ofd.html vue中呼叫iframe引用的ofd.html裡面的方法 第一步 在ofd.html 建立隱藏的按鈕 在這裡插入描述 第二部 vue中 mainfr...

vue中使用loading元件

在vue專案中自定義元件實現非同步請求資料,在獲取到資料之前有乙個loading的動態圖,使介面更友好 在這裡定義乙個loading元件 在home頁面使用 store.js import vuex from vuex import vue from vue import axios from ax...