导语:最近开发了一个基于 uniapp 框架的我的项目,有一些感触和领会,所以想记录以下一些技术和教训,在这里做一个系列总结,算是对本人做一个交代吧。

目录

  • 简介
  • 全局文件
  • 全局组件
  • 罕用 API
  • 条件编译
  • 插件开发

简介

uniapp 是 DCloud 公司于 2015 年开发的一款基于 vue 的跨端框架,编写一套代码就能够运行到 web、小程序(各种小程序)和 app(Android 和 iOS)端,使得开发一个我的项目的老本很小,效率很高,方便快捷。

uniapp 官网

性能框架图

各端运行成果

全局文件

这里次要是两个文件:pages.json治理页面路由、和manifest.json治理利用配置。

pages.json

pages.json 文件是进行全局配置,包含页面文件门路、款式、原生导航栏等内容。

以下是官网给出的配置示例:

{  "pages": [    {      "path": "pages/component/index",      "style": {        "navigationBarTitleText": "组件"      }    },    {      "path": "pages/API/index",      "style": {        "navigationBarTitleText": "接口"      }    },    {      "path": "pages/component/view/index",      "style": {        "navigationBarTitleText": "view"      }    }  ],  "condition": {    //模式配置,仅开发期间失效    "current": 0, //以后激活的模式(list 的索引项)    "list": [      {        "name": "test", //模式名称        "path": "pages/component/view/index" //启动页面,必选      }    ]  },  "globalStyle": {    "navigationBarTextStyle": "black",    "navigationBarTitleText": "演示",    "navigationBarBackgroundColor": "#F8F8F8",    "backgroundColor": "#F8F8F8",    "usingComponents": {      "collapse-tree-item": "/components/collapse-tree-item"    },    "renderingMode": "seperated", // 仅微信小程序,webrtc 无奈失常时尝试强制敞开同层渲染    "pageOrientation": "portrait", //横屏配置,全局屏幕旋转设置(仅 APP/微信/QQ小程序),反对 auto / portrait / landscape    "rpxCalcMaxDeviceWidth": 960,    "rpxCalcBaseDeviceWidth": 375,    "rpxCalcIncludeWidth": 750  },  "tabBar": {    "color": "#7A7E83",    "selectedColor": "#3cc51f",    "borderStyle": "black",    "backgroundColor": "#ffffff",    "height": "50px",    "fontSize": "10px",    "iconWidth": "24px",    "spacing": "3px",    "iconfontSrc": "static/iconfont.ttf", // app tabbar 字体.ttf文件门路 app 3.4.4+    "list": [      {        "pagePath": "pages/component/index",        "iconPath": "static/image/icon_component.png",        "selectedIconPath": "static/image/icon_component_HL.png",        "text": "组件",        "iconfont": {          // 优先级高于 iconPath,该属性依赖 tabbar 根节点的 iconfontSrc          "text": "\ue102",          "selectedText": "\ue103",          "fontSize": "17px",          "color": "#000000",          "selectedColor": "#0000ff"        }      },      {        "pagePath": "pages/API/index",        "iconPath": "static/image/icon_API.png",        "selectedIconPath": "static/image/icon_API_HL.png",        "text": "接口"      }    ],    "midButton": {      "width": "80px",      "height": "50px",      "text": "文字",      "iconPath": "static/image/midButton_iconPath.png",      "iconWidth": "24px",      "backgroundImage": "static/image/midButton_backgroundImage.png"    }  },  "easycom": {    "autoscan": true, //是否主动扫描组件    "custom": {      //自定义扫描规定      "^uni-(.*)": "@/components/uni-$1.vue"    }  },  "topWindow": {    "path": "responsive/top-window.vue",    "style": {      "height": "44px"    }  },  "leftWindow": {    "path": "responsive/left-window.vue",    "style": {      "width": "300px"    }  },  "rightWindow": {    "path": "responsive/right-window.vue",    "style": {      "width": "300px"    },    "matchMedia": {      "minWidth": 768    }  }}
  • manifest.json

manifest.json 文件是利用的配置文件,用于指定利用的名称、图标、权限等内容。

以下是官网给出的配置示例:

{  "appid": "__UNI__XXXXXX,创立利用时云端调配的,不要批改。",  "name": "利用名称,如uni-app",  "description": "利用形容",  "versionName": "1.0.0",  "versionCode": "100",  "uniStatistics": {    "enable": false  },  "app-plus": {    "allowsInlineMediaPlayback": true, //可选,Boolean类型, 是否容许 h5 中视频非全屏播放,3.8.5版本开始默认值为 true (仅iOS失效)    "mediaPlaybackRequiresUserAction": false, //可选,Boolean类型,可通过此属性配置 h5中的音视频是否可通过API自动播放,留神当设置为 false 时容许API管制自动播放,3.8.5版本开始默认值为 false(仅iOS失效 3.0.1 + 版本反对)    "nvueCompiler": "weex", //可选,字符串类型,nvue页面编译模式,可取值uni-app、weex,参考:https://ask.dcloud.net.cn/article/36074    "nvueStyleCompiler": "weex", //可选,字符串类型,nvue页面款式编译模式,可取值uni-app、weex,参考:https://ask.dcloud.net.cn/article/38751    "renderer": "native", //可选,字符串类型,可不加载基于 webview 的运行框架,可取值native    "compilerVersion": 2, //可选,数字类型,编译器版本,可取值2、3,参考:https://ask.dcloud.net.cn/article/36599    "nvueLaunchMode": "normal", //可选,字符串类型,nvue首页启动模式,compilerVersion值为3时失效,可取值normal、fast,参考:https://ask.dcloud.net.cn/article/36749    "nvue": {      //可选,JSON对象,nvue页面相干配置      "flex-direction": "row" //可选,字符串类型,nvue页面的flex-direction默认值,可取值row、row-reverse、column、column-reverse    },    "optimization": {      //可选,JSON对象,分包配置      "subPackages": true //可选,Boolean类型,是否开启分包优化,参考:https://uniapp.dcloud.io/collocation/pages.html#subpackages    },    "uniStatistics": {      //可选,JSON对象,uni统计配置      "enable": true //可选,Boolean类型,是否开启uni统计    },    "screenOrientation": [      //可选,字符串数组类型,利用反对的横竖屏      "portrait-primary", //可选,字符串类型,反对竖屏      "portrait-secondary", //可选,字符串类型,反对反向竖屏      "landscape-primary", //可选,字符串类型,反对横屏      "landscape-secondary" //可选,字符串类型,反对反向横屏    ],    "splashscreen": {      //可选,JSON对象,splash界面配置      "alwaysShowBeforeRender": true, //可选,Boolean类型,是否期待首页渲染结束后再敞开启动界面      "autoclose": true, //可选,Boolean类型,是否主动敞开启动界面      "waiting": true, //可选,Boolean类型,是否在程序启动界面显示期待雪花      "event": "loaded", //可选,字符串类型,可取值titleUpdate、rendering、loaded,uni-app我的项目已废除      "target": "defalt", //可选,字符串类型,可取值default、second,uni-app我的项目已废除      "dealy": 0, //可选,数字类型,提早主动敞开启动工夫,单位为毫秒,uni-app我的项目已废除      "ads": {        //可选,JSON对象,开屏广告配置        "backaground": "#RRGGBB", //可选,字符串类型,格局为#RRGGBB,开屏广告背景色彩        "image": "" //可选,字符串类型,底部图片地址,绝对利用资源目录门路      },      "androidTranslucent": false //可选,Boolean类型,应用“自定义启动图”启动界面时是否显示通明过渡界面,可解决点击桌面图标延时启动利用的成果    },    "modules": {      //可选,JSON对象,应用的模块      "Bluetooth": {        //可选,JSON对象,Bluetooth(低功耗蓝牙)        "description": "低功耗蓝牙"      },      "Contacts": {        //可选,JSON对象,Contact(通讯录)        "description": "通讯录"      },      "FaceID": {        //可选,JSON对象,FaceID(人脸识别),仅iOS反对        "description": "人脸识别"      },      "Fingerprint": {        //可选,JSON对象,Fingerprint(指纹识别)        "description": "指纹识别"      },      "Geolocation": {        //可选,JSON对象,Geolocation(定位)        "description": "定位"      },      "iBeacon": {        //可选,JSON对象,iBeacon        "description": "iBeacon"      },      "LivePusher": {        //可选,JSON对象,LivePusher(直播推流)        "description": "直播推流"      },      "Maps": {        //可选,JSON对象,Maps(地图)        "description": "地图"      },      "Messaging": {        //可选,JSON对象,Messaging(短彩邮件音讯)        "description": "短彩邮件音讯"      },      "OAuth": {        //可选,JSON对象,OAuth(登录鉴权)        "description": "登录鉴权"      },      "Payment": {        //可选,JSON对象,Payment(领取)        "description": "iBeacon"      },      "Push": {        //可选,JSON对象,Push(音讯推送)        "description": "iBeacon"      },      "Share": {        //可选,JSON对象,Share(分享)        "description": "iBeacon"      },      "Speech": {        //可选,JSON对象,Speech(语音输入)        "description": "iBeacon"      },      "Statistic": {        //可选,JSON对象,Statistic(统计)        "description": "iBeacon"      },      "SQLite": {        //可选,JSON对象,SQLite(统计)        "description": "iBeacon"      },      "VideoPlayer": {        //可选,JSON对象,VideoPlayer(视频播放)        "description": "iBeacon"      },      "Webview-x5": {        //可选,JSON对象,Android X5 Webview(腾讯TBS),仅Android反对        "description": "iBeacon"      },      "UIWebview": {        //可选,JSON对象,UIWebview,仅iOS反对        "description": "iBeacon"      }    },    "webView": {      // 3.5.0 + 当零碎webview低于指定版本时,会弹出提醒。或者下载x5内核后持续启动,仅Android反对      "minUserAgentVersion": "95.0.4638.75", // 最小webview版本      "x5": {        // 此属性须要勾选 Android X5 Webview 模块,具体参见上面的阐明        "timeOut": 3000, // 超时工夫        "showTipsWithoutWifi": true, // 是否在非WiFi网络环境时,显示用户确认下载x5内核的弹窗。        "allowDownloadWithoutWiFi": false // 是否容许用户在非WiFi网络时进行x5内核的下载。(如果为true,就不会显示用户确认的弹窗。)      }    },    "checkPermissionDenied": false, // 是否校验已回绝权限 如果回绝则不会再申请 默认false 不校验已回绝权限    "distribute": {      //必选,JSON对象,云端打包配置      "android": {        //可选,JSON对象,Android平台云端打包配置        "packagename": "", //必填,字符串类型,Android包名        "keystore": "", //必填,字符串类型,Android签名证书文件门路        "password": "", //必填,字符串类型,Android签名证书文件的明码        "aliasname": "", //必填,字符串类型,Android签名证书别名        "schemes": "", //可选,字符串类型,参考:https://uniapp.dcloud.io/tutorial/app-android-schemes        "abiFilters": [          //可选,字符串数组类型,参考:https://uniapp.dcloud.io/tutorial/app-android-abifilters          "armeabi-v7a",          "arm64-v8a",          "x86",          "x86_64"        ],        "permissions": [          //可选,字符串数组类型,Android权限配置          "<uses-feature android:name=\"android.hardware.camera\"/>"        ],        "custompermissions": false, //可选,Boolean类型,是否自定义Android权限配置        "permissionExternalStorage": {          //可选,JSON对象,Android平台利用启动时申请读写手机存储权限策略          "request": "always", //必填,字符串类型,申请读写手机存储权限策略,可取值none、once、always          "prompt": "" //可选,字符串类型,当request设置为always值用户回绝时弹出提示框上的内容        },        "permissionPhoneState": {          //可选,JSON对象,Android平台利用启动时申请读取设施信息权限配置          "request": "always", //必填,字符串类型,申请读取设施信息权限策略,可取值none、once、always          "prompt": "" //可选,字符串类型,当request设置为always值用户回绝时弹出提示框上的内容        },        "minSdkVersion": 21, //可选,数字类型,Android平台最低反对版本,参考:https://uniapp.dcloud.io/tutorial/app-android-minsdkversion        "targetSdkVersion": 30, //可选,数字类型,Android平台指标版本,参考:https://uniapp.dcloud.io/tutorial/app-android-targetsdkversion        "packagingOptions": [          //可选,字符串数组类型,Android平台云端打包时build.gradle的packagingOptions配置项          "doNotStrip '*/armeabi-v7a/*.so'",          "merge '**/LICENSE.txt'"        ],        "jsEngine": "v8", //可选,字符串类型,uni-app应用的JS引擎,可取值v8、jsc        "debuggable": false, //可选,Boolean类型,是否开启Android调试开关        "locale": "default", //可选,利用的语言        "forceDarkAllowed": false, //可选,Boolean类型,是否强制容许暗黑模式        "resizeableActivity": false, //可选,Boolean类型,是否反对分屏调整窗口大小        "hasTaskAffinity": false, //可选,Boolean类型,是否设置android:taskAffinity        "buildFeatures": {          //(HBuilderX3.5.0+版本反对)可选,JSON对象,Android平台云端打包时build.gradle的buildFeatures配置项          "dataBinding": false, //可选,Boolean类型,是否设置dataBinding          "viewBinding": false //可选,Boolean类型,是否设置viewBinding        }      },      "ios": {        //可选,JSON对象,iOS平台云端打包配置        "appid": "", //必填,字符串类型,iOS平台Bundle ID        "mobileprovision": "", //必填,字符串类型,iOS打包应用的profile文件门路        "p12": "", //必填,字符串类型,iOS打包应用的证书文件门路        "password": "", //必填,字符串类型,iOS打包应用的证书明码        "devices": "iphone", //必填,字符串类型,iOS反对的设施类型,可取值iphone、ipad、universal        "urlschemewhitelist": "baidumap", //可选,字符串类型,利用拜访白名单列表,参考:https://uniapp.dcloud.io/tutorial/app-ios-schemewhitelist        "urltypes": "", //可选,字符串类型,参考:https://uniapp.dcloud.io/tutorial/app-ios-schemes        "UIBackgroundModes": "audio", //可选,字符串类型,利用后盾运行模式,参考:https://uniapp.dcloud.io/tutorial/app-ios-uibackgroundmodes        "frameworks": [          //可选,字符串数组类型,依赖的零碎库,已废除,举荐应用uni原生插件扩大应用零碎依赖库          "CoreLocation.framework"        ],        "deploymentTarget": "10.0", //可选,字符串类型,iOS反对的最低版本        "privacyDescription": {          //可选,JSON对象,iOS隐衷信息拜访的许可形容          "NSPhotoLibraryUsageDescription": "", //可选,字符串类型,零碎相册读取权限形容          "NSPhotoLibraryAddUsageDescription": "", //可选,字符串类型,零碎相册写入权限形容          "NSCameraUsageDescription": "", //可选,字符串类型,摄像头应用权限形容          "NSMicrophoneUsageDescription": "", //可选,字符串类型,麦克风应用权限形容          "NSLocationWhenInUseUsageDescription": "", //可选,字符串类型,运行期拜访地位权限形容          "NSLocationAlwaysUsageDescription": "", //可选,字符串类型,后盾运行拜访地位权限形容          "NSLocationAlwaysAndWhenInUseUsageDescription": "", //可选,字符串类型,运行期后后盾拜访地位权限形容          "NSCalendarsUsageDescription": "", //可选,字符串类型,应用日历权限形容          "NSContactsUsageDescription": "", //可选,字符串类型,应用通讯录权限形容          "NSBluetoothPeripheralUsageDescription": "", //可选,字符串类型,应用蓝牙权限形容          "NSBluetoothAlwaysUsageDescription": "", //可选,字符串类型,后盾应用蓝牙权限形容          "NSSpeechRecognitionUsageDescription": "", //可选,字符串类型,零碎语音辨认权限形容          "NSRemindersUsageDescription": "", //可选,字符串类型,零碎揭示事项权限形容          "NSMotionUsageDescription": "", //可选,字符串类型,应用静止与衰弱权限形容          "NSHealthUpdateUsageDescription": "", //可选,字符串类型,应用衰弱更新权限形容          "NSHealthShareUsageDescription": "", //可选,字符串类型,应用衰弱分享权限形容          "NSAppleMusicUsageDescription": "", //可选,字符串类型,应用媒体资料库权限形容          "NFCReaderUsageDescription": "", //可选,字符串类型,应用NFC权限形容          "NSHealthClinicalHealthRecordsShareUsageDescription": "", //可选,字符串类型,拜访临床记录权限形容          "NSHomeKitUsageDescription": "", //可选,字符串类型,拜访HomeKit权限形容          "NSSiriUsageDescription": "", //可选,字符串类型,拜访Siri权限形容          "NSFaceIDUsageDescription": "", //可选,字符串类型,应用FaceID权限形容          "NSLocalNetworkUsageDescription": "", //可选,字符串类型,拜访本地网络权限形容          "NSUserTrackingUsageDescription": "" //可选,字符串类型,跟踪用户流动权限形容        },        "idfa": true, //可选,Boolean类型,是否应用广告标识        "capabilities": {          //可选,JSON对象,利用的能力配置(Capabilities)        },        "CFBundleName": "HBuilder", //可选,字符串类型,CFBundleName名称        "validArchitectures": [          //可选,字符串数组类型,编译时反对的CPU指令,可取值arm64、arm64e、armv7、armv7s、x86_64          "arm64"        ],        "pushRegisterMode": "manual", //可选,应用“Push(音讯推送)”模块时申请零碎推送权限模式,manual示意调用push相干API时申请,其它值示意利用启动时主动申请        "privacyRegisterMode": "manual" //可选,仅iOS无效,设置为manual示意用户批准隐衷政策后才获取idfv,设置为其它值示意利用启动时主动获取      },      "sdkConfigs": {        //可选,JSON对象,三方SDK相干配置        "geolocation": {          //可选,JSON对象,Geolocation(定位)模块三方SDK配置          "system": {            //可选,JSON对象,应用零碎定位            "__platform__": ["ios", "android"] //可选,字符串数组类型,反对的平台          },          "amap": {            //可选,JSON对象,应用高德定位SDK配置            "__platform__": ["ios", "android"], //可选,字符串数组类型,反对的平台            "appkey_ios": "", //必填,字符串类型,iOS平台高德定位appkey            "appkey_android": "" //必填,字符串类型,Android平台高德定位appkey          },          "baidu": {            //可选,JSON对象,应用百度定位SDK配置            "__platform__": ["ios", "android"], //可选,字符串数组类型,反对的平台            "appkey_ios": "", //必填,字符串类型,iOS平台百度定位appkey            "appkey_android": "" //必填,字符串类型,Android平台百度定位appkey          }        },        "maps": {          //可选,JSON对象,Maps(地图)模块三方SDK配置          "amap": {            //可选,JSON对象,应用高德地图SDK配置            "appkey_ios": "", //必填,字符串类型,iOS平台高德地图appkey            "appkey_android": "" //必填,字符串类型,Android平台高德地图appkey          },          "baidu": {            //可选,JSON对象,应用百度地图SDK配置            "appkey_ios": "", //必填,字符串类型,iOS平台百度地图appkey            "appkey_android": "" //必填,字符串类型,Android平台百度地图appkey          },          "google": {            //可选,JSON对象,应用Google地图SDK配置            "APIKey_ios": "", //必填,字符串类型,iOS平台Google地图APIKey            "APIKey_android": "" //必填,字符串类型,Android平台Google地图APIKey          }        },        "oauth": {          //可选,JSON对象,OAuth(登录鉴权)模块三方SDK配置          "univerify": {            //可选,JSON对象,应用一键登录(univerify)SDK配置,无需手动配置参数,云端打包主动获取配置参数          },          "apple": {            //可选,JSON对象,应用苹果登录(Sign in with Apple)SDK配置,无配置参数,仅iOS平台反对          },          "weixin": {            //可选,JSON对象,应用微信登录SDK配置            "appid": "", //必填,字符串类型,微信开放平台申请的appid            "appsecret": "", //必填,字符串类型,微信开放平台申请的appsecret            "UniversalLinks": "" //可选,字符串类型,微信开放平台配置的iOS平台通用链接          },          "qq": {            //可选,JSON对象,应用QQ登录SDK配置            "appid": "", //必填,字符串类型,QQ开放平台申请的appid            "UniversalLinks": "" //可选,字符串类型,QQ开放平台配置的iOS平台通用链接          },          "sina": {            //可选,JSON对象,应用新浪微博登录SDK配置            "appkey": "", //必填,字符串类型,新浪微博开放平台申请的appid            "redirect_uri": "", //必填,字符串类型,新浪微博开放平台配置的redirect_uri            "UniversalLinks": "" //可选,字符串类型,新浪微博开放平台配置的iOS平台通用链接          },          "google": {            //可选,JSON对象,应用Google登录SDK配置            "clientid": "" //必填,字符串类型,Google开发者后盾申请的clientid          },          "facebook": {            //可选,JSON对象,应用Facebook登录SDK配置            "appid": "" //必填,字符串类型,Facebook开发者后盾申请的appid          }        },        "payment": {          //可选,JSON对象,Payment(领取)模块三方SDK配置          "appleiap": {            //可选,JSON对象,应用Apple利用内领取配置,无配置参数,仅iOS平台反对          },          "alipay": {            //可选,JSON对象,应用支付宝领取SDK配置            "__platform__": ["ios", "android"] //可选,字符串数组类型,反对的平台          },          "weixin": {            //可选,JSON对象,应用微信领取SDK配置            "__platform__": ["ios", "android"], //可选,字符串数组类型,反对的平台            "appid": "", //必填,字符串类型,微信开放平台申请的appid            "UniversalLinks": "" //可选,字符串类型,微信开放平台配置的iOS平台通用链接          },          "paypal": {            //可选,JSON对象,应用paypal领取SDK配置            "__platform__": ["ios", "android"], //可选,字符串数组类型,反对的平台            "returnURL_ios": "", //必填,字符串类型,paypa开发者者后盾配置的iOS平台returnURL            "returnURL_android": "" //必填,字符串类型,paypa开发者者后盾配置的Android平台returnURL          },          "stripe": {            //可选,JSON对象,应用stripe领取SDK配置            "__platform__": ["ios", "android"], //可选,字符串数组类型,反对的平台            "returnURL_ios": "" //必填,字符串类型,stripe开发者者后盾配置的iOS平台returnURL          },          "google": {            //可选,JSON对象,应用google领取SDK配置,无配置参数,仅Android平台反对          }        },        "push": {          //可选,JSON对象,Push(音讯推送)模块三方SDK配置          "unipush": {            //可选,JSON对象,应用UniPush SDK配置,无需手动配置参数,云端打包主动获取配置参数            "icons": {              //可选,JSON对象,推送图标配置              "push": {                //可选,JSON对象,Push图标配置                "ldpi": "", //可选,字符串类型,一般屏设施推送图标门路,分辨率要求48x48                "mdpi": "", //可选,字符串类型,大屏设施设施推送图标门路,分辨率要求48x48                "hdpi": "", //可选,字符串类型,高分屏设施推送图标门路,分辨率要求72x72                "xdpi": "", //可选,字符串类型,720P高分屏设施推送图标门路,分辨率要求96x96                "xxdpi": "", //可选,字符串类型,1080P高密度屏幕推送图标门路,分辨率要求144x144                "xxxdpi": "" //可选,字符串类型,4K屏设施推送图标门路,分辨率要求192x192              },              "smal": {                //可选,JSON对象,Push小图标配置                "ldpi": "", //可选,字符串类型,一般屏设施推送小图标门路,分辨率要求18x18                "mdpi": "", //可选,字符串类型,大屏设施设施推送小图标门路,分辨率要求24x24                "hdpi": "", //可选,字符串类型,高分屏设施推送小图标门路,分辨率要求36x36                "xdpi": "", //可选,字符串类型,720P高分屏设施推送小图标门路,分辨率要求48x48                "xxdpi": "", //可选,字符串类型,1080P高密度屏幕推送小图标门路,分辨率要求72x72                "xxxdpi": "" //可选,字符串类型,4K屏设施推送小图标门路,分辨率要求96x96              }            }          },          "igexin": {            //可选,JSON对象,应用个推推送SDK配置,**已废除,举荐应用UniPush,UniPush是个推推送VIP版,性能更弱小**            "appid": "", //必填,字符串类型,个推开放平台申请的appid            "appkey": "", //必填,字符串类型,个推开放平台申请的appkey            "appsecret": "", //必填,字符串类型,个推开放平台申请的appsecret            "icons": {              //可选,JSON对象,推送图标配置              "push": {                //可选,JSON对象,Push图标配置                "ldpi": "", //可选,字符串类型,一般屏设施推送图标门路,分辨率要求48x48                "mdpi": "", //可选,字符串类型,大屏设施设施推送图标门路,分辨率要求48x48                "hdpi": "", //可选,字符串类型,高分屏设施推送图标门路,分辨率要求72x72                "xdpi": "", //可选,字符串类型,720P高分屏设施推送图标门路,分辨率要求96x96                "xxdpi": "", //可选,字符串类型,1080P高密度屏幕推送图标门路,分辨率要求144x144                "xxxdpi": "" //可选,字符串类型,4K屏设施推送图标门路,分辨率要求192x192              },              "smal": {                //可选,JSON对象,Push小图标配置                "ldpi": "", //可选,字符串类型,一般屏设施推送小图标门路,分辨率要求18x18                "mdpi": "", //可选,字符串类型,大屏设施设施推送小图标门路,分辨率要求24x24                "hdpi": "", //可选,字符串类型,高分屏设施推送小图标门路,分辨率要求36x36                "xdpi": "", //可选,字符串类型,720P高分屏设施推送小图标门路,分辨率要求48x48                "xxdpi": "", //可选,字符串类型,1080P高密度屏幕推送小图标门路,分辨率要求72x72                "xxxdpi": "" //可选,字符串类型,4K屏设施推送小图标门路,分辨率要求96x96              }            }          }        },        "share": {          //可选,JSON对象,Share(分享)模块三方SDK配置          "weixin": {            //可选,JSON对象,应用微信分享SDK配置            "appid": "", //必填,字符串类型,微信开放平台申请的appid            "UniversalLinks": "" //可选,字符串类型,微信开放平台配置的iOS平台通用链接          },          "qq": {            //可选,JSON对象,应用QQ分享SDK配置            "appid": "", //必填,字符串类型,QQ开放平台申请的appid            "UniversalLinks": "" //可选,字符串类型,QQ开放平台配置的iOS平台通用链接          },          "sina": {            //可选,JSON对象,应用新浪微博分享SDK配置            "appkey": "", //必填,字符串类型,新浪微博开放平台申请的appid            "redirect_uri": "", //必填,字符串类型,新浪微博开放平台配置的redirect_uri            "UniversalLinks": "" //可选,字符串类型,新浪微博开放平台配置的iOS平台通用链接          }        },        "speech": {          //可选,JSON对象,Speech(语音辨认)模块三方SDK配置          "baidu": {            //可选,JSON对象,应用百度语音辨认SDK配置            "appid": "", //必填,字符串类型,百度开放平台申请的appid            "apikey": "", //必填,字符串类型,百度开放平台申请的apikey            "secretkey": "" //必填,字符串类型,百度开放平台申请的secretkey          }        },        "statics": {          //可选,JSON对象,Statistic(统计)模块三方SDK配置          "umeng": {            //可选,JSON对象,应用友盟统计SDK配置            "appkey_ios": "", //必填,字符串类型,友盟统计开放平台申请的iOS平台appkey            "channelid_ios": "", //可选,字符串类型,友盟统计iOS平台的渠道标识            "appkey_android": "", //必填,字符串类型,友盟统计开放平台申请的Android平台appkey            "channelid_android": "" //可选,字符串类型,友盟统计Android平台的渠道标识          },          "google": {            //可选,JSON对象,应用Google Analytics for Firebase配置            "config_ios": "", //必填,字符串类型,Google Firebase统计开发者后盾获取的iOS平台配置文件门路            "config_android": "" //必填,字符串类型,Google Firebase统计开发者后盾获取的Android平台配置文件门路          }        },        "ad": {          //可选,JSON对象,uni-AD配置          "360": {            //可选,JSON对象,应用360广告联盟SDK,无需手动配置,在uni-AD后盾申请开明后主动获取配置参数          },          "csj": {            //可选,JSON对象,应用今日头条穿山甲广告联盟SDK,无需手动配置,在uni-AD后盾申请开明后主动获取配置参数          },          "gdt": {            //可选,JSON对象,应用腾讯优量汇广告联盟SDK,无需手动配置,在uni-AD后盾申请开明后主动获取配置参数          },          "ks": {            //可选,JSON对象,应用快手广告联盟SDK,无需手动配置,在uni-AD后盾申请开明后主动获取配置参数          },          "ks-content": {            //可选,JSON对象,应用快手内容联盟SDK,无需手动配置,在uni-AD后盾申请开明后主动获取配置参数          },          "sigmob": {            //可选,JSON对象,应用Sigmob广告联盟SDK,无需手动配置,在uni-AD后盾申请开明后主动获取配置参数          },          "hw": {            //可选,JSON对象,应用华为广告联盟SDK,无需手动配置,在uni-AD后盾申请开明后主动获取配置参数          },          "bd": {            //可选,JSON对象,应用百度百青藤广告联盟SDK,无需手动配置,在uni-AD后盾申请开明后主动获取配置参数          },          "BXM-AD": {            //可选,JSON对象,应用互动游戏(变现猫)SDK,无需手动配置,在uni-AD后盾申请开明后主动获取配置参数          }        }      },      "icons": {        //可选,JSON对象,利用图标相干配置        "ios": {          //可选,JSON对象,iOS平台图标配置          "appstore": "", //必填,字符串类型,分辨率1024x1024, 提交app sotre应用的图标门路          "iphone": {            //可选,JSON对象,iPhone设施图标配置            "app@2x": "", //可选,字符串类型,分辨率120x120,程序图标门路            "app@3x": "", //可选,字符串类型,分辨率180x180,程序图标门路            "spotlight@2x": "", //可选,字符串类型,分辨率80x80,Spotlight搜寻图标门路            "spotlight@3x": "", //可选,字符串类型,分辨率120x120,Spotlight搜寻图标门路            "settings@2x": "", //可选,字符串类型,分辨率58x58,Settings设置图标门路            "settings@3x": "", //可选,字符串类型,分辨率87x87,Settings设置图标门路            "notification@2x": "", //可选,字符串类型,分辨率40x40,告诉栏图标门路            "notification@3x": "" //可选,字符串类型,分辨率60x60,告诉栏图标门路          },          "ipad": {            //可选,JSON对象,iPad设施图标配置            "app": "", //可选,字符串类型,分辨率76x76,程序图标图标门路            "app@2x": "", //可选,字符串类型,分辨率152x152,程序图标图标门路            "proapp@2x": "", //可选,字符串类型,分辨率167x167,程序图标图标门路            "spotlight": "", //可选,字符串类型,分辨率40x40,Spotlight搜寻图标门路            "spotlight@2x": "", //可选,字符串类型,分辨率80x80,Spotlight搜寻图标门路            "settings": "", //可选,字符串类型,分辨率29x29,Settings设置图标门路            "settings@2x": "", //可选,字符串类型,分辨率58x58,Settings设置图标门路            "notification": "", //可选,字符串类型,分辨率20x20,告诉栏图标门路            "notification@2x": "" //可选,字符串类型,分辨率740x40,告诉栏图标门路          }        },        "android": {          //可选,JSON对象,Android平台图标配置          "ldpi": "", //可选,字符串类型,一般屏设施程序图标,分辨率要求48x48,已废除          "mdpi": "", //可选,字符串类型,大屏设施程序图标,分辨率要求48x48,已废除          "hdpi": "", //可选,字符串类型,高分屏设施程序图标,分辨率要求72x72          "xhdpi": "", //可选,字符串类型,720P高分屏设施程序图标,分辨率要求96x96          "xxhdpi": "", //可选,字符串类型,1080P高分屏设施程序图标,分辨率要求144x144          "xxxhdpi": "" //可选,字符串类型,2K屏设施程序图标,分辨率要求192x192        }      },      "splashscreen": {        //可选,JSON对象,启动界面配置        "iosStyle": "common", //可选,字符串类型,iOS平台启动界面款式,可取值common、default、storyboard        "ios": {          //可选,JSON对象,iOS平台启动界面配置          "storyboard": "", //可选,字符串类型,自定义storyboard启动界面文件门路,iosStyle值为storyboard时失效          "iphone": {            //可选,JSON对象,iPhone设施启动图配置,iosStyle值为default时失效            "default": "", //可选,字符串类型,分辨率320x480,iPhone3(G/GS)启动图片门路,已废除            "retina35": "", //可选,字符串类型,分辨率640x960,3.5英寸设施(iPhone4/4S)启动图片门路,已废除            "retina40": "", //可选,字符串类型,分辨率640x1136,4.0英寸设施(iPhone5/5S)启动图片门路            "retina40l": "", //可选,字符串类型,分辨率1136x640,4.0英寸设施(iPhone5/5S)横屏启动图片门路            "retina47": "", //可选,字符串类型,分辨率750x1334,4.7英寸设施(iPhone6/7/8)启动图片门路            "retina47l": "", //可选,字符串类型,分辨率1334x750,4.7英寸设施(iPhone6/7/8)横屏启动图片门路            "retina55": "", //可选,字符串类型,分辨率1242x2208,5.5英寸设施(iPhone6/7/8Plus)启动图片门路            "retina55l": "", //可选,字符串类型,分辨率2208x1242,5.5英寸设施(iPhone6/7/8Plus)横屏启动图片门路            "iphonex": "", //可选,字符串类型,分辨率1125x2436,5.8英寸设施(iPhoneX/XS)启动图片门路            "iphonexl": "", //可选,字符串类型,分辨率2436x1125,5.8英寸设施(iPhoneX/XS)横屏启动图片门路            "portrait-896h@2x": "", //可选,字符串类型,分辨率828x1792,6.1英寸设施(iPhoneXR)启动图片门路            "landscape-896h@2x": "", //可选,字符串类型,分辨率1792x828,6.1英寸设施(iPhoneXR)iPhoneXR横屏启动图片门路            "portrait-896h@3x": "", //可选,字符串类型,分辨率1242x2688,6.5英寸设施(iPhoneXS Max)启动图片门路            "landscape-896h@3x": "" //可选,字符串类型,分辨率2688x1242,6.5英寸设施(iPhoneXS Max)横屏启动图片门路          },          "ipad": {            //可选,JSON对象,iPad设施启动图配置,iosStyle值为default时失效            "portrait": "", //可选,字符串类型,分辨率768x1004,iPad竖屏启动图片门路,已废除            "portrait-retina": "", //可选,字符串类型,分辨率1536x2008,iPad高分屏竖屏启动图片门路,已废除            "landscape": "", //可选,字符串类型,分辨率1024x748,iPad横屏启动图片门路,已废除            "landscape-retina": "", //可选,字符串类型,分辨率2048x1496,iPad高分屏横屏启动图片门路,已废除            "portrait7": "", //可选,字符串类型,分辨率768x1024,9.7/7.9英寸iPad/mini竖屏启动图片门路            "landscape7": "", //可选,字符串类型,分辨率1024x768,9.7/7.9英寸iPad/mini横屏启动图片门路            "portrait-retina7": "", //可选,字符串类型,分辨率1536x2048,9.7/7.9英寸iPad/mini高分屏竖屏图片门路            "landscape-retina7": "", //可选,字符串类型,分辨率2048x1536,9.7/7.9英寸iPad/mini高分屏横屏启动图片门路            "portrait-1112h@2x": "", //可选,字符串类型,分辨率1668x2224,10.5英寸iPad Pro竖屏启动图片门路            "landscape-1112h@2x": "", //可选,字符串类型,分辨率2224x1668,10.5英寸iPad Pro横屏启动图片门路            "portrait-1194h@2x": "", //可选,字符串类型,分辨率1668x2388,11英寸iPad Pro竖屏启动图片门路            "landscape-1194h@2x": "", //可选,字符串类型,分辨率2388x1668,11英寸iPad Pro横屏启动图片门路            "portrait-1366h@2x": "", //可选,字符串类型,分辨率2048x2732,12.9英寸iPad Pro竖屏启动图片门路            "landscape-1366h@2x": "" //可选,字符串类型,分辨率2732x2048,12.9英寸iPad Pro横屏启动图片门路          }        },        "androidStyle": "common", //可选,字符串类型,Android平台启动界面款式,可取值common、default        "android": {          //可选,JSON对象,Android平台启动图片配置, androidStyle值为default时失效          "ldpi": "", //可选,字符串类型,分辨率320x442,低密度屏幕启动图片门路,已废除          "mdpi": "", //可选,字符串类型,分辨率240x282,中密度屏幕启动图片门路,已废除          "hdpi": "", //可选,字符串类型,分辨率480x762,高密度屏幕启动图片门路          "xhdpi": "", //可选,字符串类型,分辨率720x1242,720P高密度屏幕启动图片门路          "xxhdpi": "" //可选,字符串类型,分辨率1080x1882,1080P高密度屏幕启动图片门路        }      },      "orientation": [        //可选,字符串数组类型,利用反对的横竖屏,**已废除,应用screenOrientation配置**        "portrait-primary",        "portrait-secondary",        "landscape-primary",        "landscape-secondary"      ]    },    "compatible": {      //可选,JSON对象,uni-app兼容模式      "ignoreVersion": false, //可选,Boolean类型,是否疏忽版本兼容查看提醒      "runtimeVersion": "", //可选,字符串类型,兼容的uni-app运行环境版本号,多个版本应用,宰割      "compilerVersion": "" //可选,字符串类型,兼容的编译器版本号    },    "confusion": {      //可选,JSON对象,原生混同加密配置,参考:https://uniapp.dcloud.io/tutorial/app-sec-confusion      "description": "", //可选,字符串类型,原生混同形容      "resources": {        //必填,JSON对象,原生混同文件配置        "js/common.js": {          //可选,JSON对象,键名为须要原生混同的文件门路        }      }    },    "channel": "", //可选,字符串类型,渠道标识    "cers": {      //可选,JSON对象,利用的异样解体与错误报告系统配置      "crash": true //可选,Boolean类型,是否提交利用异样解体信息    },    "cache": {      //可选,JSON对象,Webview窗口默认应用的缓存模式,uni-app我的项目已废除      "mode": "default" //可选,字符串类型,可取值default、cacheElseNetwork、noCache、cacheOnly    },    "error": {      //可选,JSON对象,页面加载谬误配置,uni-app我的项目仅对webview组件无效,参考:https://uniapp.dcloud.io/tutorial/app-webview-error      "url": "" //必填,字符串类型,webview页面谬误是跳转的页面地址    },    "kernel": {      //可选,JSON对象,webview内核配置      "ios": "WKWebview", //可选,iOS平台应用的webview类型,可取值WKWebview、UIWebview      "recovery": "reload" //可选,iOS平台应用WKWebview时,内核解体后的解决逻辑,可取值restart、reload、none    },    "launchwebview": {      //可选,JSON对象,利用首页相干配置,uni-app我的项目不倡议手动批改      "plusrequire": "normal", //可选,字符串类型,加载plus API机会,可取值ahead、normal、later、none      "injection": false, //可选,Boolean类型,是否提前注入plus API      "overrideresource": [        //可选,JSON对象数组,利用首页的拦挡资源相干配置        {          "match": "", //可选,字符串类型,匹配拦挡的资源url地址的正则表达式          "redirect": "", //可选,字符串类型,拦挡资源的重定向地址          "mime": "", //可选,字符串类型,拦挡资源的数据类型mime          "encoding": "", //可选,字符串类型,拦挡资源的数据编码          "header": {            //可选,JSON对象,拦挡资源的http头数据          }        }      ],      "overrideurl": {        //可选,JSON对象,利用首页的拦挡链接申请解决逻辑        "mode": "reject", //可选,字符串类型,拦挡模式,可取值allow、reject        "match": "", //可选,字符串类型,匹配拦挡规定,反对正则表达式        "exclude": "none" //可选,字符串类型,排除拦挡理规定,可取值none、redirect      },      "replacewebapi": {        //可选,JSON对象,是否重写Web API实现相干配置        "geolocation": "none" //可选,字符串类型,重写规范定位API,可取值none、alldevice、auto      },      "subNViews": [        //可选,JSON对象数组,首页原生View相干配置,已废除        {          "id": "", //可选,字符串类型,原生View标识          "styles": {            //可选,JSON对象,原生View款式          },          "tags": [            //可选,JSON对象数组,原生View中蕴含的tag标签列表            {}          ]        }      ],      "titleNView": {        //可选,JSON对象,标题栏相干配置        "backgroundColor": "#RRGGBB", //可选,字符串类型,#RRGGBB格局,标题栏背景色彩        "titleText": "", //可选,字符串类型,标题栏题目文字内容        "titleColor": "#RRGGBB", //可选,字符串类型,#RRGGBB格局,标题栏题目文字色彩        "titleSize": "17px", //可选,字符串类型,题目字体大小,默认大小为17px        "autoBackButton": true, //可选,Boolean类型,是否显示标题栏上返回键        "backButton": {          //可选,JSON对象,返回键款式          "backgournd": "#RRGGBB", //可选,字符串类型,#RRGGBB格局,返回按钮背景色彩          "color": "#RRGGBB", //可选,字符串类型,#RRGGBB格局,返回图标色彩          "colorPressed": "#RRGGBB" //可选,字符串类型,#RRGGBB,返回图标按下时的色彩        },        "buttons": [          //可选,JSON对象数组,标题栏按钮配置          {            "color": "#RRGGBB", //可选,字符串类型,#RRGGBB格局,按钮上的文字色彩            "colorPressed": "#RRGGBB", //可选,字符串类型,#RRGGBB格局,按钮按下状态的文字色彩            "float": "right", //可选,字符串类型,按钮显示地位,可取值left、right            "fontWeight": "normal", //可选,字符串类型,按钮上文字的粗细,可取值normal、bold            "fontSize": "22px", //可选,字符串类型,按钮上文字的大小            "fontSrc": "", //可选,字符串类型,按钮上文字应用的字体文件门路            "text": "" //可选,字符串类型,按钮上显示的文字          }        ],        "splitLine": {          //可选,JSON对象,标题栏分割线款式          "color": "#RRGGBB", //可选,字符串类型,#RRGGBB格局,分割线色彩          "height": "1px" //可选,字符串类型,分割线高度        }      },      "statusbar": {        //可选,JSON对象,状态栏配置        "background": "#RRGGBB" //可选,字符串类型,#RRGGBB格局,沉迷式状态栏款式下零碎状态栏背景色彩      },      "top": "0px", //可选,字符串类型,Webview的顶部偏移量,反对px、%单位      "height": "100%", //可选,字符串类型,Webview窗口高度,反对px、%单位      "bottom": "0px", //可选,字符串类型,Webview的底部偏移量,仅在未同时设置top和height属性时失效      "backButtonAutoControl": "none", //可选,字符串类型,运行环境主动解决返回键的管制逻辑,可取值none、hide、close      "additionalHttpHeaders": {        //可选,JSON对象,额定增加HTTP申请头数据      }    },    "nativePlugins": {      //可选,JSON数组对象,uni原生插件配置,参考:https://nativesupport.dcloud.net.cn/NativePlugin/use/use_local_plugin      "%UniPlugin-ID%": {        //可选,JSON对象,键名为插件标识,值为插件配置参数      }    },    "popGesture": "none", //可选,字符串类型,窗口侧滑返回默认成果,可取值none、close、hide    "runmode": "liberate", //可选,字符串类型,利用资源运行模式,可取值normal、liberate    "safearea": {      //可选,JSON对象,平安区域配置      "background": "#RRGGBB", //可选,字符串类型,#RRGGBB格局,平安区域背景色彩      "backgroundDark": "#RRGGBB", //可选,字符串类型,#RRGGBB格局,暗黑模式平安区域背景色彩      "bottom": {        //可选,JSON对象,底部平安区域配置        "offset": "none" //可选,字符串类型,平安区域偏移值,可取值auto、none      },      "left": {        //可选,JSON对象,左侧平安区域配置        "offset": "none" //可选,字符串类型,平安区域偏移值,可取值auto、none      },      "right": {        //可选,JSON对象,左侧平安区域配置        "offset": "none" //可选,字符串类型,平安区域偏移值,可取值auto、none      }    },    "softinput": {      //可选,JSON对象,软键盘相干配置      "navBar": "auto", //可选,字符串类型,iOS平台软键盘上导航条的显示模式,可取值auto、none      "auxiliary": false, //可选,Boolean类型,是否开启辅助输入性能      "mode": "adjustResize" //可选,字符串类型,弹出零碎软键盘模式,可取值adjustResize、adjustPan    },    "ssl": {      //可选,JSON对象,ssl相干设置      "untrustedca": "accept" //可选,字符串类型,https申请时服务器非受信证书的解决逻辑,可取值accept、refuse、warning    },    "statusbar": {      //可选,JSON对象,利用启动后的零碎状态栏相干配置      "immersed": "none", //可选,字符串类型,沉迷式状态栏款式,可取值none、suggestedDevice、supportedDevice      "style": "light", //可选,字符串类型,零碎状态栏款式(前景色彩),可取值dark、light      "background": "#RRGGBB" //可选,字符串类型,#RRGGBB格局,零碎状态栏背景色彩    },    "useragent": {      //可选,JSON对象,利用UserAgent相干配置,默认值为零碎UserAgent,并增加 uni-app Html5Plus/1.0      "value": "", //可选,字符串类型,设置的默认userAgent值      "concatenate": false //可选,Boolean类型,是否将value值作为追加值连贯到零碎默认userAgent值之后    },    "useragent_android": {      //可选,JSON对象,Android平台利用UserAgent相干配置,优先级高于useragent配置      "value": "", //可选,字符串类型,设置的默认userAgent值      "concatenate": false //可选,Boolean类型,是否将value值作为追加值连贯到零碎默认userAgent值之后    },    "useragent_ios": {      //可选,JSON对象,iOS平台利用UserAgent相干配置,优先级高于useragent配置      "value": "", //可选,字符串类型,设置的默认userAgent值      "concatenate": false //可选,Boolean类型,是否将value值作为追加值连贯到零碎默认userAgent值之后    }  },  "quickapp": {},  "mp-weixin": {    "appid": "wx结尾的微信小程序appid",    "uniStatistics": {      "enable": false    }  },  "mp-baidu": {    "appid": "百度小程序appid"  },  "mp-toutiao": {    "appid": "抖音小程序appid"  },  "mp-lark": {    "appid": "飞书小程序appid"  },  "h5": {    "title": "演示",    "template": "index.html",    "router": {      "mode": "history",      "base": "/hello/"    },    "async": {      "loading": "AsyncLoading",      "error": "AsyncError",      "delay": 200,      "timeout": 3000    }  }}
  • uni.scss

这个是全局的款式文件,官网预约了很多罕用的款式规定和变量。

  • package.json

在 web 和小程序增加一些依赖包,扩大其余的性能。

  • vite.config.js

vue3 我的项目生成的配置文件。

全局组件

全局组件次要是内置组件和扩大组件。

内置组件

所有的视图组件,包含 view、swiper 等,自身不显示任何可视化元素,用处都是为了包裹其余真正显示的组件,能够间接在 vue 页面中应用。

常见有:

  • uniapp 组件
  • vue 组件
  • nvue 组件
  • 小程序组件

扩大组件

uni-ui 是 DCloud 提供的一个跨端 ui 库,它是基于 vue 组件的、flex 布局的、无 dom 的跨全端 ui 框架,不包含根底组件,它是根底组件的补充,有些组件须要到插件市场下载才能够应用。

常见有:

  • 列表组件
  • 表单组件
  • 表格组件
  • 加载更多组件
  • 自定义导航栏组件
  • 弹出层组件

罕用 API

根底

  • onPageNotFound,页面不存在事件;
  • onError,谬误事件;
  • onAppShow,页面前台事件;
  • onAppHide,页面后盾事件;
  • addInterceptor,拦截器;

网络

  • request,发动申请;
  • uploadFile,上传文件;
  • downloadFile,下载文件;
  • connectSocket,创立一个 websocket 连贯;
  • onSocketOpen,ws 关上事件;
  • onSocketError,谬误事件;
  • sendSocketMessage,发送 ws 音讯;
  • onSocketMessage,接管 ws 音讯;
  • closeSocket,敞开 ws;
  • onSocketClose,监听敞开 ws;

页面路由

  • navigateTo,保留以后页面,跳转到其余页面;
  • redirectTo,敞开以后页面,跳转到其余页面;
  • reLaunch,敞开所有页面,跳转到其余页面;
  • switchTab,跳转到 tabBar 底部导航页面;
  • navigateBack,返回上一个页面或多级页面;

数据缓存

  • setStorage,将数据存储在本地缓存中的指定 key 中,笼罩原来该 key 的内容;
  • getStorage,从本地缓存中获取指定 key 的内容;
  • removeStorage,从本地缓存中移除指定 key 及内容;
  • clearStorage,革除本地缓存;
  • getStorageInfo,获取本地缓存信息;

界面

  • showToast,显示音讯提示框;
  • hideToast,暗藏音讯提示框;
  • showLoading,显示加载提示框;
  • hideLoading,暗藏加载提示框;
  • showModal,显示模态弹出框;
  • showActionSheet,从底部弹出操作菜单;
  • onPullDownRefresh,下拉刷新;
  • createSelectorQuery,节点信息;

文件

  • chooseImage,抉择图片;
  • saveImageToPhotosAlbum,保留图片到相册;
  • chooseFile,抉择文件;
  • saveFile,保留文件到本地;
  • removeSavedFile,删除本地保留的文件;
  • getSavedFileList,获取本地保留的文件列表;
  • getFileInfo,获取文件信息;
  • openDocument,新页面打开文档;

条件编译

概念

条件编译是用非凡的正文作为标记,在编译时依据这些非凡的正文,将正文外面的代码编译到不同平台。

写法:以 #ifdef#ifndef%PLATFORM% 结尾,以 #endif 结尾。

  • #ifdef:if defined 仅在某平台存在;
  • #ifndef:if not defined 除了某平台均存在;
  • %PLATFORM%:平台名称;

%PLATFORM%值:

失效条件
VUE3HBuilderX 3.2.0+ 详情 (uni-app js 引擎版)
APPApp
APP-PLUSApp(uni-app js 引擎版)
APP-PLUS-NVUE 或 APP-NVUEApp nvue 页面
APP-ANDROIDApp Android 平台 仅限 uts 文件
APP-IOSApp iOS 平台 仅限 uts 文件
H5H5
MP-WEIXIN微信小程序
MP-ALIPAY支付宝小程序
MP-BAIDU百度小程序
MP-TOUTIAO抖音小程序
MP-LARK飞书小程序
MP-QQQQ 小程序
MP-KUAISHOU快手小程序
MP-JD京东小程序
MP-360360 小程序
MP微信小程序/支付宝小程序/百度小程序/抖音小程序/飞书小程序/QQ 小程序/360 小程序
QUICKAPP-WEBVIEW快利用通用(蕴含联盟、华为)
QUICKAPP-WEBVIEW-UNION快利用联盟
QUICKAPP-WEBVIEW-HUAWEI快利用华为

反对的文件

  • .vue、.pug
  • .css、.scss、.less、.stylus
  • .js、.ts
  • pages.json

写法

vue/nvue 模板里应用 <!-- 正文 -->,css 应用 /* 正文 */,js 应用 // 正文。

  • 模板写法
<!--  #ifdef  %PLATFORM% -->平台特有的组件<!--  #endif -->
  • css 款式写法
/*  #ifdef  %PLATFORM%  */平台特有款式/*  #endif  */
  • JS 写法
// #ifdef  %PLATFORM%平台特有的API实现;// #endif
  • pages.json
// #ifdef %PLATFORM%{  "pagePath": "pages/eg",  "text": "案例"}// #endif

插件开发

插件市场官网

有数千款插件,反对前端组件、js sdk、页面模板、我的项目模板、原生插件等多种类型。在生态建设上远远当先于竞品。

请留神尽量在官网市场寻找插件,npm 等三方市场没有 uni-app 兼容性形容,很容易下载到无奈跨平台的、仅适配 web 的插件。

插件分类

DCloud 插件市场将插件分为前端组件、JS SDK、uni-app 前端模板、App 原生插件、uniCloud 等 7 大类、20 多个子类。

uni\_modules

uni\_modules 是 uni-app 的插件模块化标准(HBuilderX 3.1.0+反对),通常是对一组 js sdk、组件、页面、uniCloud 云函数、公共模块等的封装,用于嵌入到 uni-app 我的项目中应用,也反对间接封装为我的项目模板。

好了,以上就是 uniapp 的框架常识总结。