中文字幕 日本 在线 高清,久久精品国产99精品国,超碰人人香蕉,一区二区三区无码高清视频

前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)

1、微信小程序的注冊和微信開發(fā)者工具的下載

在微信公眾平臺注冊小程序賬號,注冊時注意小程序和公眾號不能使用同一個帳號,登錄小程序時,公眾號會自動下線。一般賬號為郵箱號,所以提前準(zhǔn)備倆郵箱號,方便注冊。注冊號一號進(jìn)入如下界面:

前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)

可以完善小程序信息,以及實名認(rèn)證等,這些都是傻瓜式的操作,懂漢語就行,不知道在哪里就多試試,試試又不懷孕!

然后下載你開發(fā)的工具:

前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)

下載完成后安裝即可。

2、創(chuàng)建項目

進(jìn)入開發(fā)工具界面,新建開發(fā)項目:

前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)

這里會自動生成一些文件夾,下面是文件夾的具體說明:

pages:存放項目頁面文件,一般一個目錄對應(yīng)一個頁面。

utils:存放工具函數(shù)(一般是自己封裝)。

app.js:全局的邏輯處理

app.json: (1)頁面文件路徑設(shè)置

(2)窗口外觀設(shè)置

(3)設(shè)置/添加tabbar(底部/頂部導(dǎo)航)

app.wxss:全局樣式

project.config.json:項目配置文件

sitemap.json:小程序內(nèi)搜索,開發(fā)者可以通過 `sitemap.json` 配置,或者管理后臺頁面收錄開關(guān)來配置其小程 序頁面是否允許微信索引

前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)

小程序中.wxml對應(yīng)的是html文件,.wxss對應(yīng)的是css文件。

文件夾中文件組成:

home.js:邏輯處理

home.json:靜態(tài)數(shù)據(jù)

home.wxml:頁面結(jié)構(gòu)

home.wxss:頁面布局

3、利用tabBar設(shè)置小程序的菜單導(dǎo)航

上面寫到設(shè)置、添加tabBar在app.json文件中,所以在此文件中設(shè)置需要的菜單導(dǎo)航,以及引入需要的圖標(biāo)。這里可以將整個項目中用到的小圖標(biāo)在阿里圖標(biāo)庫中進(jìn)行添加,跟vue項目中一樣,然后下載到本地,將對應(yīng)的文件復(fù)制到項目文件中即可。

前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)

這里一般設(shè)置三個導(dǎo)航項,iconPath為默認(rèn)未點擊時顯示的圖標(biāo)路徑,selectedIconPath為選擇點擊后的圖片路徑。效果如下圖:

前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)

如果想讓導(dǎo)航位置位于整個頁面的上方,可以將tabBar中的position屬性設(shè)置為top即可。

前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)

這里拷貝一下微信官方文檔內(nèi)容,供大家參考:

前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)

4、全局設(shè)置

前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)

backgroundTextStyle string dark——下拉 loading 的樣式,僅支持 dark / light

avigationBarBackgroundColor HexColor #000000——導(dǎo)航欄背景顏色,如 #000000

navigationBarTitleText string——導(dǎo)航欄標(biāo)題文字內(nèi)容

navigationBarTextStyle string white——導(dǎo)航欄標(biāo)題顏色,僅支持 black / white

復(fù)制快捷鍵:

向下:Alt Shift 向下光標(biāo)鍵

向上:Alt Shift 向上光標(biāo)鍵

5、應(yīng)用頭部布局

由于空間較小等,我們可能在“開發(fā)者工具”中開發(fā)不太習(xí)慣,這時我們可以在其他軟件中進(jìn)行開發(fā),如webstorm中,只需要安裝WeChat weapp Support插件。

如需要微信小程序中默認(rèn)的小圖標(biāo):

前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)

用如下icon標(biāo)簽引入即可(這里引入了搜素圖標(biāo)):

前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)

6、數(shù)據(jù)請求和頁面跳轉(zhuǎn)

在基本布局和樣式完成后,就是請求數(shù)據(jù)和渲染界面。

請求后臺api接口數(shù)據(jù)一般封裝一個工具函數(shù),因為有很多頁面要請求數(shù)據(jù)。工具函數(shù)的封裝大概如下:

前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)

然后就是在頁面引入使用它:

前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)

接下來就是如下所示的一些數(shù)據(jù)渲染:

前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)

在一些頁面中要實現(xiàn)頁面間的跳轉(zhuǎn),微信小程序中用bindtap,相當(dāng)于綁定一個點擊事件,然后在對應(yīng)的js文件中寫入需要跳轉(zhuǎn)的頁面路徑:

前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)前端系列——微信小程序開發(fā)(前端微信小程序開發(fā)流程)

版權(quán)聲明:本文內(nèi)容由互聯(lián)網(wǎng)用戶自發(fā)貢獻(xiàn),該文觀點僅代表作者本人。本站僅提供信息存儲空間服務(wù),不擁有所有權(quán),不承擔(dān)相關(guān)法律責(zé)任。如發(fā)現(xiàn)本站有涉嫌抄襲侵權(quán)/違法違規(guī)的內(nèi)容, 請發(fā)送郵件至 舉報,一經(jīng)查實,本站將立刻刪除。

(0)
上一篇 2024年5月9日 上午10:02
下一篇 2024年5月9日 上午10:14

相關(guān)推薦

  • C 語言簡單編程速成(c語言簡單的編程)

    我們將所有的 C 語言要素放置到一份易讀的備忘錄上。 ? 來源:linux.cn ? 作者:Seth Kenlon ? 譯者:鄭 ? (本文字?jǐn)?shù):5500,閱讀時長大約:8 分鐘)…

    科研百科 2023年4月20日
    277
  • 院項目管理系統(tǒng)

    院項目管理系統(tǒng) 隨著現(xiàn)代醫(yī)院的不斷發(fā)展,項目管理已經(jīng)成為醫(yī)院管理中不可或缺的一部分。院項目管理系統(tǒng)是一種能夠幫助醫(yī)院進(jìn)行項目管理的軟件工具,可以提高醫(yī)院的項目管理效率,降低管理成本…

    科研百科 2024年12月13日
    1
  • zotero翻譯 知云

    zotero翻譯知云:用技術(shù)為學(xué)術(shù)文獻(xiàn)傳遞知識 隨著數(shù)字化時代的發(fā)展,學(xué)術(shù)文獻(xiàn)的數(shù)字化已經(jīng)成為一個不可避免的趨勢。通過zotero等工具,學(xué)術(shù)文獻(xiàn)可以方便地被分享和傳播,同時也為研…

    科研百科 2024年11月30日
    6
  • 寧夏石化質(zhì)檢中心:基層黨建與基層管理這樣有機(jī)融合(基層黨建管理工作)

    文|龐婭靜 譚子瑩 來源|《國企》雜志2023年3月號 “全面從嚴(yán)治黨要在國有企業(yè)落實落地,必須從基本組織、基本隊伍、基本制度嚴(yán)起?!苯陙?,中國石油寧夏石化公司質(zhì)檢中心黨總支全面…

    科研百科 2023年11月5日
    169
  • 越南農(nóng)業(yè)科研項目名單

    越南農(nóng)業(yè)科研項目名單 近年來,越南農(nóng)業(yè)科學(xué)研究發(fā)展迅速,取得了許多重要成果。為了促進(jìn)越南農(nóng)業(yè)生產(chǎn)的發(fā)展,政府支持了多項農(nóng)業(yè)科研項目,下面列舉一些具體的科研項目。 1. 農(nóng)業(yè)科技創(chuàng)新…

    科研百科 2024年12月9日
    3
  • 物流管理系統(tǒng)項目意義

    物流管理系統(tǒng)項目意義 隨著全球化的加速和國際貿(mào)易的不斷增長,物流管理已經(jīng)成為了企業(yè)競爭的重要一環(huán)。物流管理系統(tǒng)是一種集物流信息化、智能化、自動化于一體的管理系統(tǒng),能夠有效提高物流效…

    科研百科 2025年1月20日
    2
  • 系統(tǒng)集成項目管理師秘訣

    系統(tǒng)集成項目管理師秘訣 系統(tǒng)集成項目管理師是一個非常重要的職業(yè),負(fù)責(zé)協(xié)調(diào)和管理系統(tǒng)集成項目的各個階段,確保項目按時、按質(zhì)、按預(yù)算完成。作為一個系統(tǒng)集成項目管理師,需要具備豐富的項目…

    科研百科 2025年1月28日
    4
  • 考項目管理

    項目管理:如何確保項目的成功 項目管理在商業(yè)和工業(yè)領(lǐng)域中的應(yīng)用越來越廣泛。一個好的項目管理計劃可以幫助組織實現(xiàn)其目標(biāo),并在項目中取得成功。然而,成功的項目管理并不容易,需要仔細(xì)規(guī)劃…

    科研百科 2024年8月21日
    3
  • 思辨科學(xué)與創(chuàng)制科學(xué)

    思辨科學(xué)與創(chuàng)制科學(xué):探索科學(xué)的本質(zhì)與未來 科學(xué)是一種探究自然現(xiàn)象和規(guī)律的方法,它通過實驗和觀察來驗證假設(shè),并通過理論推導(dǎo)來解釋自然現(xiàn)象。思辨科學(xué)和創(chuàng)制科學(xué)則是探究科學(xué)的本質(zhì)和未來發(fā)…

    科研百科 2024年11月14日
    3
  • 項目工時管理系統(tǒng)推薦:對比9款主流工時記錄、管理系統(tǒng)(項目工時管理app)

    工時管理是項目型企業(yè)的重要需求,特別是在人力成本占比較高的行業(yè),如軟件開發(fā)、設(shè)計咨詢、會計律師等。工時管理可以幫助企業(yè)核算項目人工成本,控制成本投入,提高項目利潤,客觀考核員工績效…

    科研百科 2024年4月23日
    115