H5 混合移動app應用開發 開篇

2021-09-09 02:42:19 字數 1801 閱讀 5096

html5、html5+、vue.js、mui、js

為什麼有vue.js?vue.js是一款mvvm框架,也是目前三大流行的mvvm前端框架之一(另外兩種:react和angular),在做技術選型之前,我有先對這三種框架去做乙個簡單的研究,後面感覺還是vue.js的語法比較優雅,就像我喜歡c#語言一樣。

在開發h5混合應用之前,你必須要有一點前端的基礎。

css3、html、js、vue.js、h5+、mui

html、js、css相信只要做過web開發,相信就不會陌生,但是有許多開發人員這一塊比較薄弱,可能是因為長期做後端開發的緣故。如果基礎實在太差,建議先臨時抱佛腳充充電,學個入門還是很簡單的,敲幾天**就可以了。

感覺一樣學一天,三天就夠了。

至於vue.js的話,去官網過一篇文件,官網:然後就可以用起來了,一天足矣。

mui,官網:

,建議初略過一遍,相信你看完依舊有點雲裡霧裡,沒關係,先了解就行了,同樣用一天時間。

h5+的話,網上查資料了解一下它是做什麼的,還有它的一些常用介面,半天。html5+ api文件:

現在基礎知識就準備得差不多了,就開始搞起來。

你也可以直接檢視mui官網提供的**塊手冊:

對著多敲幾遍,你會很驚喜的。不過即便hbuilder如此牛叉的快捷鍵和提示,但是它依舊存在乙個硬傷,那就是**格式化功能,用過vs的人,對其它ide總是會有各種吐槽點,所以我通常都是用hbuilder寫**,用vs查錯和格式化**。

新建官網的demo專案

**目錄結構如下:

這就是官網提供的demo的原始碼,可以看下這些示例。但是既然叫做示例,就表示,這裡面很多東西無法直接在正式專案上那樣用,否則就是作死,而我所謂的各種坑也正是因為生產和示例終究是不一樣的。尤其是配合vue.js一起用的時候,坑更多了。

mui有坑,h5+有坑,vue有坑,而他們匯聚一起的時候,就是各種坑.....

hbuilder目前已經在頻繁更新、頻繁打補丁,一旦有更新,我們在開啟hbuilder的時候,它就會自動提示,然而更新有風險,公升級需謹慎,公升級之前先看下更新的日誌,看它修復了什麼?新增了什麼,然後再觀望一周,再更新,這樣比較保險。

你準備好了嗎?開始一起來和我吐槽那些坑吧!

相關學習資料,可以參考我之前發的文章:mui開發大全

專案截圖:

H5 混合移動app應用開發 開篇

html5 html5 vue.js mui js 為什麼有vue.js?vue.js是一款mvvm框架,也是目前三大流行的mvvm前端框架之一 另外兩種 react和angular 在做技術選型之前,我有先對這三種框架去做乙個簡單的研究,後面感覺還是vue.js的語法比較優雅,就像我喜歡c 語言一...

混合 App 開啟 H5 除錯開關

hybrid應用如何去做自動化呢?hybrid是native巢狀了web,對於native頁面,我們可以採用原生的自動化框架uiautomator xcuitest,而對於web頁面,我們可以採用chromedriver,兩者相結合完成自動化測試。現在流行的說法是移動端內嵌的web可以稱為h5,雖然...

移動端h5開發基礎

移動端h5開發基礎知識 一.手機端開發頁面必須要加一段 注 這段 的主要意思是 讓頁面寬度等於裝置寬度,縮放比例為1,禁止使用者縮放。用於檢測視口,主要的效果就是取消下面的滾動條,讓頁面適應螢幕。二.為自己的頁面設定最大寬度和最小寬度 主要作用是在螢幕足夠大的時候,頁面也不會失真。三.相容手機螢幕大...