前端開發元件化是個很重要的思想，但是平常只是在node搭建的環境下，使用webpack管理react或
者vue專案時，會自定義元件，然後其他頁面引用自定義的元件。但是在普通的html前端頁面開發時怎麼去使用vue定義可重用元件呢，就像element-ui那樣，我們可以不用node環境，而是引用js檔案，也可以實現使用各種定義好的元件。
今天由於工作需要，電腦沒有搭建vue專案，而是採用引入vue.js的方式開發頁面，我需要定義很多頁面都可以使用的公共元件，在仔細閱讀了vue官網的元件化方面的文件之後，產生了這樣的思路。
我在js檔案中封裝了公共元件，到時候需要使用該元件時，引入該js檔案，就可以在相應的html檔案中直接使用定義好的公共元件。具體實現如下，把元件的標籤元素作為字串來定義，然後註冊vue元件，然後就可以在其他頁面使用了。
建立js檔案來定義公共元件
tmpl_list.js
const list =
` `
;// 定義vue元件
var listcomponent = vue.
extend(,
},//定義元件的資料
methods:
,//定義元件的方法
props:
['list'],
//配置需要傳入的屬性})；
//註冊vue全域性元件
vue.
component
("tmpl-list"
,listcomponent)
;
在index.html中引入vue.js來進行開發，也要引用定義好公共元件的js檔案；
src=
"vue.js"
>
script
>
src=
"tmpl_list.js"
>
script
>
>
:list
="arr"
>
>
div>
>
newvue(,
,,],
}})script
>
html中使用js將axios請求封裝
1 新建 httprequest.js 檔案，定義如下方法 axios封裝post請求 function axiospostrequst url,data return ret header then resp catch error return result get請求 function axi...
ajax原生js物件導向封裝及開發時遇到的問題
在工作中我們經常會向後台請求各種資料，遇到各種問題，以自己在該開始開發時經常出現的錯誤來說明。1 首先定義乙個物件 ajax var ajax else xhr.onreadystatechange function 上面是封裝好的ajax物件,在呼叫時只需要進行下面操作 window.onload...
使用原生js封裝Ajax函式
對與原生ajax的封裝，依然需要遵循請求的四個步驟 1 建立xmlhttprequest物件 2 監聽onreadstatechange函式 3 使用open函式新增引數 4 使用send函式傳送請求 首先，封裝建立xhr的函式 1 2 createxhr 3 建立xhr相容物件4 5functio...