快應用開發踩坑文檔

 

項目構建：

``` bash

## 參考網址

- [快應用官網](https://www.quickapp.cn/)

- [快應用開發文檔](https://doc.quickapp.cn/)

- [快應用開發圈資源彙總](https://github.com/quickappdev/awesome-quickapp)

# 克隆代碼到本地

git clone https://e.coding.net/xue/miniMallApp.git

# 安裝相關依賴

npm install

# 運行本地開發項目，

npm run watch

# 啓動瀏覽器調試server

npm run server

# 打包生成上線的rpk包

npm run build

# 生成簽名文件

npm run release

```

 

## 快應用環境搭建及安裝

- 環境搭建

  - PC安裝toolkit工具

- 踩坑整理

  1. 修改日誌輸出等級

  2. console.dir 沒法使用 

  3. 安裝項目依賴必須用 npm install , cnpm和yarn安裝都有問題

  4. 遠程調試必須保證手機和PC處於同一局域網

## 快應用項目開發過程

- 文件目錄結構優化

  - 全部須要用到的api,統一在 app.ux 聲明後導出使用(this.$app.$def.)

- 踩坑集錦

  - fetch.fetch 請求返回的數據必須 JSON.parse() 處理一下

  - storage 數據存儲的時候，必須保證 value 的值是 字符串格式

  - 自定義組件傳參props, 不能夠有大寫

## 組件使用

- 組件

  - div 最多不能超過2個text,會存在重複渲染問題

  - span 格式化的文本，只能做爲<text>與\<a>的子組件

  - text 文本的溢出隱藏 lines 行數 text-overflow 超出的處理

  - input 沒有 tel 類型

  - label 沒有子組件 ，屬性只有 target 到目標id, 不是 for

  - 全部與大小相關的樣式（例如width、font-size）均以基準寬度（默認750px）爲基礎

  - border-(top,bottom,left,right) 樣式無效，須要分開設置

  - input 獲取value ，e.value "\<input attr={"placeholder":"請輸入手機號","id":"phone","type":"number","value":"1"} style={"flex":1,"paddingLeft":"10px","fontSize":"32px","color":"#686868"}></input>"

  - 文字必須在text標籤裏，放在div裏不顯示

  - 彈層超過一平時用list組件，不然滑屏沒有效果，可是效果是吸頂

  - list在使用下拉刷新加載數據時會出現閃退，可使用onappear事件代替

- 事件

  - 通用事件： click, longpress, focus, blur, appear, disappear, swipe

  - 使用方法： 事件前 + on, 例如：onclick, onblur...

- 屬性

  - background-color

  - border-bottom-width

  - border-radius 百分比無效，必須用具體數值