小程序總結(jié)

微信小程序優(yōu)點(diǎn)和缺點(diǎn):

優(yōu)點(diǎn):

即用即走退疫、無需安裝、省流量勾哩、省安裝時(shí)間抗蠢、不占用桌面

依托微信流量举哟,天生推廣傳播優(yōu)勢(shì)

開發(fā)成本比app低

缺點(diǎn):

用戶留存,即用即走是優(yōu)勢(shì)迅矛,也存在一些問題

入口相對(duì)傳統(tǒng)app要深很多

限制較多妨猩,頁(yè)面大小不能超過2MB,不能打開超過10個(gè)層級(jí)的頁(yè)面

小程序關(guān)聯(lián)微信公眾號(hào)如何確定用戶的唯一性:

如果開發(fā)者擁有多個(gè)移動(dòng)應(yīng)用秽褒、網(wǎng)站應(yīng)用壶硅、和公眾帳號(hào)(包括小程序),可通過 unionid 來區(qū)分用戶的唯一性销斟,因?yàn)橹灰峭粋€(gè)微信開放平臺(tái)帳號(hào)下的移動(dòng)應(yīng)用庐椒、網(wǎng)站應(yīng)用和公眾帳號(hào)(包括小程序),用戶的 unionid 是唯一的票堵。換句話說扼睬,同一用戶,對(duì)同一個(gè)微信開放平臺(tái)下的不同應(yīng)用悴势,unionid 是相同的

<meta charset="utf-8">

準(zhǔn)備工作

1:用沒有注冊(cè)過微信公眾平臺(tái)的郵箱注冊(cè)一個(gè)微信公眾號(hào)窗宇, 申請(qǐng)帳號(hào) ,點(diǎn)擊 https://mp.weixin.qq.com/wxopen/waregister?action=step1 根據(jù)指引填寫信息和提交相應(yīng)的資料,就可以擁有自己的小程序帳號(hào)特纤。注冊(cè)完成之后開始登錄军俊。

image.png

2:登錄 https://mp.weixin.qq.com

我們可以在菜單 “設(shè)置”-“開發(fā)設(shè)置” 看到小程序的 AppID 了 。小程序的 AppID 相當(dāng)于小程序平臺(tái)的一個(gè)身份證捧存,后續(xù)你會(huì)在很多地方要用到 AppID (注意這里要區(qū)別于服務(wù)號(hào)或訂閱號(hào)的 AppID)粪躬。有了小程序帳號(hào)之后,我們需要一個(gè)工具來開發(fā)小程序昔穴。
根據(jù)官方教程進(jìn)行開發(fā)https://mp.weixin.qq.com/debug/wxadoc/dev/

image.png

小程序初始化目錄:
1:page 頁(yè)面文件夾 存放項(xiàng)目頁(yè)面渲染相關(guān)文件镰官,新建文件夾,再新建pages吗货;


image.png

上手開發(fā)

標(biāo)簽組件
<view></view>
<text></text>

模板語法
①條件渲染
<view wx:if="{{表達(dá)式}}">xxx</view>
<view wx:elif="{{表達(dá)式}}">xxx</view>
<view wx:else>xxx</view>
②列表渲染
<view wx:for="{{list}}" wx:key="{{index}}">{{index}}--{{item}}</view>
<text wx:for="{{list}}" wx:for-item="myitem" wx:for-index="myindex"> {{myindex}}~{{myitem}} </text>
③模板template
定義
<template name="temp"> <view>標(biāo)題:{{name}}</view> </template>
調(diào)用
<template is="temp" {{name:"han"}}>
導(dǎo)入模板
<import src = "xxx.wxml" />
④非template-任意的wxml文件
導(dǎo)入
<include src="xxx.wxml" />
相當(dāng)于把xxx.wxm文件內(nèi)容(除了template)拷貝到include地方
⑤事件
類型
bindtap 單擊
bindinput 表單發(fā)生改變
事件參數(shù)
<view bindtap="showMsg" data-msg="xxx"></view> showMsg(e){ e.target.dataset.msg //獲取事件參數(shù) },
⑥表單

<input value="{{msg}}" bindinput="inputHd"></input>
inputHd(e){
e.detail.value //表單的值
},
更新數(shù)據(jù)與視圖
this.setData({數(shù)據(jù)名1:數(shù)據(jù)值1})

組件與API
①組件
容器view
內(nèi)容text
表單input/button
②api
1.showToast

wx.showToast({
title:'成功',
icon:'success',
duration:2000
})
2.showLoading

wx.showLoading({
title:'加載中',
})
setTimeout(function(){
wx.hideLoading()
},2000)
3.setStorageSync存儲(chǔ)數(shù)據(jù)
wx.setStorageSync('key','value')
4.getStorageSync獲取數(shù)據(jù)
var value = wx.getStorageSync('key')
5.wx.request請(qǐng)求數(shù)據(jù)

導(dǎo)航
①標(biāo)簽<navigator>
01 默認(rèn)導(dǎo)航 url=""
02 open-type打開頁(yè)面類型
navigate 默認(rèn)打開
redirect不留歷史記錄
switchTab 切換底部欄
navigateBack 返回
03 打開小程序
a. app.json中配置
"navigateToMiniProgramAppIdList": ["wxb8f91a4e8d7eb4ae"],
b. navigator填寫
<navigator target="miniProgram" open-type="navigate" app-id="wxb8f91a4e8d7eb4ae" path="要打開的頁(yè)面泳唠,默認(rèn)首頁(yè)" extra-data="" version="release"> 面試寶典 </navigator>

②js方式
wx.navigateTo({url:''})跳轉(zhuǎn)頁(yè)面
wx.redirectTo({url:''})跳轉(zhuǎn)不留歷史記錄
wx.switchTab({url:''})底部導(dǎo)航欄頁(yè)面切換
wx.navigateBack()返回
wx.navigateToMiniProgram({appid:'appid'})切換小程序

生命周期
onLoad 頁(yè)面的參數(shù)(ajax請(qǐng)求通知在這個(gè)函數(shù)調(diào)用)
onShow 頁(yè)面顯示
onReady頁(yè)面首次渲染
onHide
switchTab,切換底部導(dǎo)航蘭navigate跳轉(zhuǎn)頁(yè)面
onUnload卸載(redirect時(shí)候,頁(yè)面就會(huì)卸載)
onPullDownRefresh 下拉刷新
onReachBottom觸底
onShareAppMessage 分享

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末宙搬,一起剝皮案震驚了整個(gè)濱河市笨腥,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌勇垛,老刑警劉巖脖母,帶你破解...
    沈念sama閱讀 221,695評(píng)論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異闲孤,居然都是意外死亡谆级,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,569評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來哨苛,“玉大人鸽凶,你說我怎么就攤上這事〗ㄇ停” “怎么了玻侥?”我有些...
    開封第一講書人閱讀 168,130評(píng)論 0 360
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)亿蒸。 經(jīng)常有香客問我凑兰,道長(zhǎng),這世上最難降的妖魔是什么边锁? 我笑而不...
    開封第一講書人閱讀 59,648評(píng)論 1 297
  • 正文 為了忘掉前任姑食,我火速辦了婚禮,結(jié)果婚禮上茅坛,老公的妹妹穿的比我還像新娘音半。我一直安慰自己,他們只是感情好贡蓖,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,655評(píng)論 6 397
  • 文/花漫 我一把揭開白布曹鸠。 她就那樣靜靜地躺著,像睡著了一般斥铺。 火紅的嫁衣襯著肌膚如雪彻桃。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,268評(píng)論 1 309
  • 那天晾蜘,我揣著相機(jī)與錄音邻眷,去河邊找鬼。 笑死剔交,一個(gè)胖子當(dāng)著我的面吹牛肆饶,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播岖常,決...
    沈念sama閱讀 40,835評(píng)論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼抖拴,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了腥椒?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,740評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤候衍,失蹤者是張志新(化名)和其女友劉穎笼蛛,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體蛉鹿,經(jīng)...
    沈念sama閱讀 46,286評(píng)論 1 318
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡滨砍,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,375評(píng)論 3 340
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片惋戏。...
    茶點(diǎn)故事閱讀 40,505評(píng)論 1 352
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡领追,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出响逢,到底是詐尸還是另有隱情绒窑,我是刑警寧澤,帶...
    沈念sama閱讀 36,185評(píng)論 5 350
  • 正文 年R本政府宣布舔亭,位于F島的核電站些膨,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏钦铺。R本人自食惡果不足惜订雾,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,873評(píng)論 3 333
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望矛洞。 院中可真熱鬧洼哎,春花似錦、人聲如沸沼本。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,357評(píng)論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)擅威。三九已至壕探,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間郊丛,已是汗流浹背李请。 一陣腳步聲響...
    開封第一講書人閱讀 33,466評(píng)論 1 272
  • 我被黑心中介騙來泰國(guó)打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留厉熟,地道東北人导盅。 一個(gè)月前我還...
    沈念sama閱讀 48,921評(píng)論 3 376
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像揍瑟,于是被迫代替她去往敵國(guó)和親白翻。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,515評(píng)論 2 359