首頁小程序開發(fā) 正文

微信小程序開發(fā)ui框架（微信小程序開發(fā)前端框架）

小程序開發(fā) 2023-02-15T13:24:13 3386

今天給各位分享微信小程序開發(fā)ui框架的知識，其中也會對微信小程序開發(fā)前端框架進行解釋，如果能碰巧解決你現(xiàn)在面臨的問題，別忘了關(guān)注本站，現(xiàn)在開始吧！本文目錄一覽： 1、基于微信小程序的的電商訂單的技術(shù)框架是什么

今天給各位分享微信小程序開發(fā)ui框架的知識，其中也會對微信小程序開發(fā)前端框架進行解釋，如果能碰巧解決你現(xiàn)在面臨的問題，別忘了關(guān)注本站，現(xiàn)在開始吧！

基于微信小程序的的電商訂單的技術(shù)框架是什么

layui框架。

該系統(tǒng)有網(wǎng)站后臺管理端和小程序客戶端,后臺前端框架使用的是layui框架。

微信小程序，小程序的一種，是一種不需要下載安裝即可使用的應(yīng)用，它實現(xiàn)了應(yīng)用“觸手可及”的夢想，用戶掃一掃或搜一下即可打開應(yīng)用。

微信小程序開發(fā)ui框架（微信小程序開發(fā)前端框架）

H5開發(fā)與微信小程序開發(fā)的區(qū)別有哪些

一、運行環(huán)境的不同。

傳統(tǒng)的HTML5的運行環(huán)境是瀏覽器，包括webview，而微信小程序的運行環(huán)境并非完整的瀏覽器，大家注意，我這里寫的是“非完整的瀏覽器”，有以下幾個原因

小程序的開發(fā)過程中會用到HTML5相關(guān)的技術(shù)(并非全部)

小程序最后的發(fā)布上線需要微信審核，微信在不更新自身軟件的情況下可以將小程序更新到自身軟件內(nèi)，這就聯(lián)想到了React Native框架,并且已經(jīng)有開發(fā)者在微信小程序的開發(fā)工具源碼中發(fā)現(xiàn)使用了React和NodeWebkit庫

官方文檔中著重強調(diào)了腳本內(nèi)是無法使用瀏覽器中常用的window對象和document對象（基于這一點，像zepto/jquery這種操作dom的庫就被完全拋棄了）

所以我個人認為，小程序的運行環(huán)境很有可能是微信開發(fā)團隊基于瀏覽器內(nèi)核完全重構(gòu)的一個內(nèi)置解析器，針對小程序?qū)ｉT做了優(yōu)化，配合自己定義的開發(fā)語言標準，提升了小程序的性能。

不過由于微信給開發(fā)者提供了開發(fā)工具，而開發(fā)工具中也內(nèi)置了編程、調(diào)試、開發(fā)環(huán)境、發(fā)布于一身，我們也不用再探討它的最終運行環(huán)境了，只要按照官方文檔進行開發(fā)就可以了。并且從微信團隊給開發(fā)者提供開發(fā)工具這一舉動，讓我聯(lián)想到了蘋果給開發(fā)者提供的X-CODE開發(fā)工具，可以想象微信的“野心”可見一斑

二、開發(fā)成本的不同。

這里我提出了一個問題，當我們面對一個HTML5 web開發(fā)需求時，我們需要考慮什么呢？拋去開發(fā)工具（vscode、sublimtext、Atom等）不談，大到前端框架（Angular、react、vue、backbone等）、模塊管理工具（Webpack 、Browserify 等）、任務(wù)管理工具（Grunt、Gulp等），小到UI庫選擇、接口調(diào)用工具（ajax、Fetch Api等）、瀏覽器兼容性等都要我們一一考略，再不濟用jqery插件寫H5，也要在開發(fā)過程中去尋找合適的jquery插件來配合項目。盡管這些工具可定制化非常高，并且提高了開發(fā)者的開發(fā)效率，但我相信項目開發(fā)的配置工作已經(jīng)消耗了不少精力，盡管大部分開發(fā)者都有自己的配置模板，但長久以來對于項目中使用的各種外部庫的版本迭代、版本升級所產(chǎn)生的成本應(yīng)該也不低。

而當我們面對一個微信小程序的開發(fā)需求時，我們需要考慮什么呢？微信團隊提供了開發(fā)者工具，并且規(guī)范了開發(fā)標準，前端常見的HTML、CSS變成了微信自定義的WXML、WXSS，WXML中盡管全部是自定義標簽，但官方文檔中都有明確的使用介紹，相信上手應(yīng)該是非常容易的；WXSS、JSON和JS文件中的寫法稍有限制，但整體相差不多。在統(tǒng)一了這些標準之后，作為一個開發(fā)者，你會發(fā)現(xiàn)，自己只要專注寫程序就可以了：

當需要調(diào)用后端接口時，調(diào)用發(fā)起請求API

當需要上傳下載時，調(diào)用上傳下載API

當需要數(shù)據(jù)緩存時，調(diào)用本地存儲API

引入地圖、使用羅盤、調(diào)用支付、調(diào)用掃碼等等功能都可以直接使用

UI庫方面，框架自然帶有自家weui庫加成

并且在使用這些API時，你不用再去顧慮瀏覽器兼容性，不用擔心生產(chǎn)環(huán)境中出現(xiàn)不可預料的奇妙BUG，可見微信小程序的開發(fā)成本確實相比以往的web開發(fā)低很多。

三、獲取系統(tǒng)級權(quán)限的不同。

微信小程序相對于HTML5 web應(yīng)用能獲得更多的系統(tǒng)權(quán)限，比如網(wǎng)絡(luò)通信狀態(tài)、數(shù)據(jù)緩存能力等，這些系統(tǒng)級權(quán)限都可以和微信小程序無縫銜接，也就是官方宣稱的擁有Native App的流暢性能，而這一點恰巧是HTML5 web應(yīng)用經(jīng)常被詬病的地方，這也是HTML5的大多應(yīng)用場景被定位在業(yè)務(wù)邏輯簡單、功能單一的原因。

四、應(yīng)用在生產(chǎn)環(huán)境的運行流暢度。

這條無論對于用戶還是開發(fā)者來說，都是最直觀的感受。長久以來，當HTML5應(yīng)用面對復雜的業(yè)務(wù)邏輯或者豐富的頁面交互時，它的體驗總是不盡人意，需要不斷的對項目優(yōu)化來提升用戶體驗。但是由于微信小程序運行環(huán)境獨立，盡管同樣用html+css+js去開發(fā)，但配合微信的解析器最終渲染出來的是原生組件的效果，自然體驗上將會更進一步。請使用手機"掃一掃"x

前端ui框架排名

在前端項目開發(fā)過程中，現(xiàn)在很少有人會使用原生的CSS來搭建頁面，總歸都會引入一些前端UI框架以減少代碼的書寫。一般為了方便自己的使用，很多大公司都有自己的一套UI框架，同時也會把其開源出來。下面就是最近經(jīng)常使用并且很流行的一些前端UI框架，總有一款適合你：

Mint UI

Mint UI是餓了么團隊開發(fā)的基于Vue .js的移動端UI框架，它包含豐富的 CSS 和 JS 組件，能夠滿足日常的移動端開發(fā)需要。

WeUI

WeUI是一套同微信原生視覺體驗一致的基礎(chǔ)樣式庫，由微信官方設(shè)計團隊為微信內(nèi)網(wǎng)頁和微信小程序量身設(shè)計，令用戶的使用感知更加統(tǒng)一。包含button、cell、dialog、toast、article、icon等各式元素。

Cube-ui

Cube-ui 是滴滴團隊開發(fā)的基于 Vue.js 實現(xiàn)的精致移動端組件庫。支持按需引入和后編譯，輕量靈活；擴展性強，可以方便地基于現(xiàn)有組件實現(xiàn)二次開發(fā)。

iView UI

iView UI是一個強大的UI庫，基于vue，有很多實用的基礎(chǔ)組件比elementui的組件更豐富，主要服務(wù)于 PC 界面的中后臺產(chǎn)品。使用單文件的 Vue 組件化開發(fā)模式基于 npm + webpack + babel 開發(fā)，支持 ES2015 高質(zhì)量、功能豐富友好的 API ，自由靈活地使用空間。

LayUI

LayUI是一款采用自身模塊規(guī)范編寫的前端 UI 框架，遵循原生 HTML/CSS/JS 的書寫與組織形式，門檻極低，拿來即用。其外在極簡，卻又不失飽滿的內(nèi)在，體積輕盈，組件豐盈，從核心代碼到 API 的每一處細節(jié)都經(jīng)過精心雕琢，非常適合界面的快速開發(fā)。

ElementUI

Element是餓了么前端開源維護的Vue UI組件庫,組件齊全，基本涵蓋后臺所需的所有組件，文檔講解詳細，例子也很豐富。主要用于開發(fā)PC端的頁面，是一個質(zhì)量比較高的Vue UI組件庫。

at-ui

at-ui 是一款阿里團隊創(chuàng)建的基于 Vue 2.x 的前端 UI 組件庫，主要用于快速開發(fā) PC 網(wǎng)站產(chǎn)品。它提供了一套 npm + webpack + babel 前端開發(fā)工作流程，CSS 樣式獨立，即使采用不同的框架實現(xiàn)都能保持統(tǒng)一的 UI 風格。

amaze UI

Amaze UI 是一個移動優(yōu)先的跨屏前端框架。提供基礎(chǔ)樣式，網(wǎng)格，表格、表單、按鈕及常用組件樣式。是一個輕量級（所有 CSS 和 JS gzip 后 100 kB 左右）、?Mobile first?的前端框架

Vant UI

Vant UI是有贊前端團隊基于有贊統(tǒng)一的規(guī)范實現(xiàn)的 Vue 組件庫，提供了一整套 UI 基礎(chǔ)組件和業(yè)務(wù)組件。通過 Vant，可以快速搭建出風格統(tǒng)一的頁面，提升開發(fā)效率。

Flutter

Flutter 是谷歌的移動端 UI 框架，可在極短的時間內(nèi)構(gòu)建 Android 和 iOS 上高質(zhì)量的原生級應(yīng)用。 Flutter 可與現(xiàn)有代碼一起工作, 它被世界各地的開發(fā)者和組織使用, 并且 Flutter 是免費和開源的.

ionic

Ionic既是一個CSS框架也是一個Javascript UI庫,Ionic 是目前最有潛力的一款 HTML5 手機應(yīng)用開發(fā)框架。通過 SASS 構(gòu)建應(yīng)用程序，它提供了很多 UI 組件來幫助開發(fā)者開發(fā)強大的應(yīng)用。它使用 JavaScript MVVM 框架和 AngularJS 來增強應(yīng)用。提供數(shù)據(jù)的雙向綁定，使用它成為 Web 和移動開發(fā)者的共同選擇。