微信小程序開發(fā)筆記衫冻。持續(xù)更新

一诀紊、頁面布局

position: relative; 相對布局。使用top隅俘、left邻奠、bottom、right为居。
position: absolute; 絕對布局碌宴。
display: flex;
flex-direction: row; 左右布局。
z-index 層級關(guān)系蒙畴。position: relative 生效贰镣。

假如text需要垂直居中顯示
先給text添加一個(gè)view,在view中樣式設(shè)置

  display: flex;
  justify-content: center;

再在text中樣式設(shè)置

  line-height: 100rpx;  /*對應(yīng)需要顯示的高度膳凝,一般和view保持一致*/
  text-align: center;

左右布局flex彈性盒模型對象
父視圖view

  display: flex; 
  flex-direction: row;
  align-items: center;  /*內(nèi)容居中

其中flex-direction屬性:
flex-start(默認(rèn)值):左對齊
flex-end:右對齊
center: 居中
space-between:兩端對齊碑隆,項(xiàng)目之間的間隔都相等。
space-around:每個(gè)項(xiàng)目兩側(cè)的間隔相等鸠项。所以干跛,項(xiàng)目之間的間隔比項(xiàng)目與邊框的間隔大一倍子姜。

視圖固定底部

position:fixed;
bottom:0;

二祟绊、npm導(dǎo)入及使用

1、npm install -y(npm install)哥捕,初始化牧抽,根目錄創(chuàng)建package.json package-lock.json。
2遥赚、導(dǎo)入需要導(dǎo)入的庫扬舒。npm install xxx。編輯器詳情勾選構(gòu)建npm凫佛,工具->構(gòu)建讲坎。
3、.json中引入對應(yīng)需要使用的庫愧薛。

三晨炕、WebUI使用

1、$ npm install weui-miniprogram
2毫炉、app.wxss 導(dǎo)入

@import '/miniprogram_npm/weui-miniprogram/weui-wxss/dist/style/weui.wxss';

3瓮栗、對應(yīng).json導(dǎo)入需要使用的組件,

"usingComponents": {
    "mp-gallery": "../../miniprogram_npm/weui-miniprogram/gallery/gallery"
  },

4、.wxml/.js使用對應(yīng)組件標(biāo)簽费奸。

注意:可查看對應(yīng)組件中的代碼弥激,可修改WebUI組件中的代碼達(dá)到自定義效果,或者復(fù)制對應(yīng)class愿阐,在使用頁面的.xcss中自定義樣式微服。
如設(shè)置cells中的icon寬高。首先查看cell.wxml中icon class為weui-cell__icon缨历,可在WebUI組件的cell.wxml中直接修改style职辨,但為了不影響后續(xù)其他引用,所以在需要修改樣式的.xcss中設(shè)置.weui-cell__icon{屬性}戈二。

四舒裤、string 獲取 length

五、網(wǎng)絡(luò)請求wx.request

POST請求需要設(shè)置content-type和服務(wù)器對應(yīng)觉吭,否則服務(wù)器取不到對應(yīng)的傳參數(shù)據(jù)

header: {
   'content-type': 'application/x-www-form-urlencoded',
},

六腾供、字符串操作

截取:從第1位截取到第3位(不是從第一位開始往后截三位)

string.substring(1,3)

七鲜滩、布局 display屬性

常用方法:
none:隱藏伴鳖,不會顯示
block:設(shè)置元素為塊級元素,理解為每個(gè)元素的類容單獨(dú)占據(jù)一行徙硅。默認(rèn)情況下榜聂,block元素寬度自動填滿其父元素寬度。類似h1嗓蘑、h1须肆。
inline:設(shè)置元素為內(nèi)聯(lián)元素,元素不會單獨(dú)占據(jù)一行桩皿,設(shè)置width,height屬性無效豌汇。其寬度隨元素的內(nèi)容而變化。
inline-block:不會單獨(dú)占據(jù)一行泄隔,同時(shí)有塊級元素和行內(nèi)元素的屬性拒贱,可以設(shè)置width,height。類似標(biāo)簽功能佛嬉,一行內(nèi)顯示逻澳,但需要固定每個(gè)標(biāo)簽寬高。

八暖呕、align-items斜做、align-self、align-content使用及區(qū)別

使用前需要將父視圖設(shè)置為 display: flex;
align-items:設(shè)置每個(gè)flex子視圖的對齊方式缰揪。常用屬性:
flex-start頂部對齊陨享;
flex-end底部對齊葱淳;
center居中對齊;
stretch拉伸適應(yīng)容器抛姑。

九赞厕、setdata給data中子元素設(shè)置值

var keyStr = 'carNoNumData[' + i + '].value';
      this.setData({
        [keyStr]: "",
      })

數(shù)組添加元素:push
數(shù)組添加數(shù)組:concat

十、Vant有贊控件導(dǎo)入及使用

1定硝、安裝:先初始化npm—— cd到小程序工程根目錄皿桑,執(zhí)行 npm init
對應(yīng)的工程描述可一直按回車鍵跳過,最后按照提示輸入yes即可初始化成功蔬啡。
2诲侮、執(zhí)行導(dǎo)入命令:npm i @vant/weapp -S --production
3、小程序工程勾選使用npm模板
4箱蟆、工具->構(gòu)建npm
5沟绪、在miniprogram_npm文件夾中可查看vant代碼

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市空猜,隨后出現(xiàn)的幾起案子绽慈,更是在濱河造成了極大的恐慌,老刑警劉巖辈毯,帶你破解...
    沈念sama閱讀 206,311評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件坝疼,死亡現(xiàn)場離奇詭異,居然都是意外死亡谆沃,警方通過查閱死者的電腦和手機(jī)钝凶,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,339評論 2 382
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來唁影,“玉大人耕陷,你說我怎么就攤上這事∝惨В” “怎么了啃炸?”我有些...
    開封第一講書人閱讀 152,671評論 0 342
  • 文/不壞的土叔 我叫張陵铆隘,是天一觀的道長卓舵。 經(jīng)常有香客問我,道長膀钠,這世上最難降的妖魔是什么掏湾? 我笑而不...
    開封第一講書人閱讀 55,252評論 1 279
  • 正文 為了忘掉前任,我火速辦了婚禮肿嘲,結(jié)果婚禮上融击,老公的妹妹穿的比我還像新娘。我一直安慰自己雳窟,他們只是感情好尊浪,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,253評論 5 371
  • 文/花漫 我一把揭開白布匣屡。 她就那樣靜靜地躺著,像睡著了一般拇涤。 火紅的嫁衣襯著肌膚如雪捣作。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,031評論 1 285
  • 那天鹅士,我揣著相機(jī)與錄音券躁,去河邊找鬼。 笑死掉盅,一個(gè)胖子當(dāng)著我的面吹牛也拜,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播趾痘,決...
    沈念sama閱讀 38,340評論 3 399
  • 文/蒼蘭香墨 我猛地睜開眼慢哈,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了永票?” 一聲冷哼從身側(cè)響起岸军,我...
    開封第一講書人閱讀 36,973評論 0 259
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎瓦侮,沒想到半個(gè)月后艰赞,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 43,466評論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡肚吏,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 35,937評論 2 323
  • 正文 我和宋清朗相戀三年方妖,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片罚攀。...
    茶點(diǎn)故事閱讀 38,039評論 1 333
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡党觅,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出斋泄,到底是詐尸還是另有隱情杯瞻,我是刑警寧澤,帶...
    沈念sama閱讀 33,701評論 4 323
  • 正文 年R本政府宣布炫掐,位于F島的核電站魁莉,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏募胃。R本人自食惡果不足惜旗唁,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,254評論 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望痹束。 院中可真熱鬧检疫,春花似錦、人聲如沸祷嘶。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,259評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至烛谊,卻和暖如春企垦,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背晒来。 一陣腳步聲響...
    開封第一講書人閱讀 31,485評論 1 262
  • 我被黑心中介騙來泰國打工钞诡, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人湃崩。 一個(gè)月前我還...
    沈念sama閱讀 45,497評論 2 354
  • 正文 我出身青樓荧降,卻偏偏與公主長得像,于是被迫代替她去往敵國和親攒读。 傳聞我的和親對象是個(gè)殘疾皇子朵诫,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,786評論 2 345

推薦閱讀更多精彩內(nèi)容