极速快3精准计划|极速快3有规律吗
用戶
 找回密碼
 立即注冊

QQ登錄

只需一步,快速開始

掃一掃,登錄網站

小程序社區 首頁 教程 查看內容

小程序開發遇到的一些問題和吐槽

Rolan 2019-4-17 00:32

小程序在微信這個超級平臺的帶動下,這兩年著實是越來越火。剛出來那一陣,翻了翻文檔簡單的看了看,沒有組件、沒有wsx(雖然現在也很難用,有總比沒有強)還有無窮無盡的坑。一直沒有深入去學習去了解。期間美團開源 ...

小程序在微信這個超級平臺的帶動下,這兩年著實是越來越火。剛出來那一陣,翻了翻文檔簡單的看了看,沒有組件、沒有wsx(雖然現在也很難用,有總比沒有強)還有無窮無盡的坑。一直沒有深入去學習去了解。期間美團開源了一個mpvue,一個基于Vue的小程序開發框架。上手沒什么成本,自己寫了一個極其簡單簡陋查詢快遞的小程序–快遞去哪兒咯。最近工作上來了小程序的需求,組內交流之后打算用小程序原生的那一套搞。現學現搞all in了兩周小程序。這里記錄一下遇到的一些小問題或者坑吧。

吐槽

那我們就從吐槽開始

(很喜歡的一部電影)

  • 繁瑣過時的API
    在網頁端開發web,說道處理請求相比axios、fetch已經成了主流,鏈式調用try···catch處理錯誤。但是小程序卻用著過時的ES3風格的API(wx.request)。這樣在使用起來很不優雅,在使用了調用的時候很容易造成回調地獄。
    想要使用promise這種鏈式調用的實行。我們不得不去封裝一個HTTP類。下面是自己封裝的一個HTTP類

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32

    export class HTTP {
    request({ url, data={}, method="GET" }) {
    return new Promise((resolve, reject) => {
    this._request(url, resolve, reject, data, method)
    })
    }

    _request(url, resolve, reject, data={}, method="GET") {
    wx.request({
    url: config.api_base_url + url,
    method,
    data,
    header: {
    'content-type': 'application/json'
    },
    success: (res) => {
    const code = res.statusCode.toString()
    // 判斷狀態碼
    if (code.startsWith('2')) {
    resolve(res.data)
    } else {
    reject()
    }
    },
    fail: (err) => {
    reject()
    }
    })
    }

    }
  • 面向JSON編程
    接著API設計的過時,不得不吐槽這種面向JSON編程的方式。開發一個小程序需要app.json去配置全局的應用配置、路由配置還有全局UI配置。每個頁面,每個組件也有相應json文件去配置。

  • wxs真的很難用
    作為頁面的腳本語言,微信這邊自己現成的JS不用,自己搞了一套嵌入式腳本語言,里面只能寫ES3的語法不說(還不是完整版的ES3語法)沒有 Array, Object 對象;或遇到引入 lodash 會報錯 TypeError: Cannot read property ‘prototype’ of undefined

  • js頁面中無法使用絕對路徑

  • wxss 里的注釋只能用 // 寫法,不能用 //…

  • component組件中與支持onShow這個生命周期

遇到的一些問題

  • 在開發橫向滑動圖片的組件的時候,自然而然想到在sroll-view組件上添加scroll-x屬性,但是依然劃不動。

解決:父級在設置寬高的同時必須設white-space: nowrap; 子級要用display: inline-block;用浮動都不行

  • 頁面配置背景色可使用 backgroundColor,模擬器里并沒有生效。最后發現backgroundColor 是指窗體背景顏色,而不是頁面背景色。

  • textarea組件是原生組件,placeholder-style 目前只支持設置 fontSize、fontWeight、color 屬性

  • maptextarea 為原生組件,頁面層級最高,就算設置了z-index也無法被覆蓋。(這個是真的坑)

  • text組件,看名字我們自然而然想到這個是不是和網頁中的span標簽一樣。但是兩個text標簽放在一起會出現高度不一致的問題,以及類似網頁中的pre標簽,會保留文本中的空格和換行符號(開發的時候發現怎么換行了,一個勁的調樣式,結果發現=。=真的是無語)

解決: 索性全換成view組件了

  • 發消息模版時需要獲得提交表單時的 formId,通過 form 及鍵盤右下角完成提交事件對象 e.detail 獲取不到 formId,只能通過 form button 來獲取。

  • component在處理數據變化的時候 可以使用properties中設置的observe或者頁面中寫wxs,wxs其實相當于vue里面的過濾器。這兩個可以結合情況使用

  • wx:if 和hidden結合實際情況適用。hidden不能直接賦值在自定義組件上,需要放在組件里的最外層的view上。用過傳參的形式使用

以上

小程序的開發怎么說真的是又愛又恨,很是微妙。這兩周的開發學習感覺又回到了當時研究RN的時候,當效果、成果做出來的時候很有成就感。同時小程序也蠻適合自己瞎搞的,最近在搞的一個repo
Teemo,除此之外這兩天小程序官方有公測了serverless,感覺發揮的空間更大了。最近自己還真有個好點子,等搞完這個嘗試一波(自娛自樂)

鮮花
鮮花
雞蛋
雞蛋
分享至 : QQ空間
收藏
原作者: github 來自: github
极速快3精准计划 31选7选号技巧 三中三心水高手论坛 pc蛋蛋历史开奖 新时时彩任选一 看澳洲幸运8开奖结果直播 河北时时官网下载 江苏15选5开奖结果公告 香港九龙开奖资料结果 广东十一选五18号走势图 全天实时计划