uni-app进阶之样式框架/生产环境【day10】

简介: uni-app进阶之样式框架/生产环境【day10】

样式框架

在这里插入图片描述

uni-UI扩展组件符合easycom组件规范,可以直接应用。
如果组件不符合easycom规范,则需要在使用之前在代码中手动导入并注册组件。

uni app的JS

uni app的JS代码在H5端的浏览器中运行。非H5端(包括小程序和应用程序),Android平台运行在V8引擎中,IOS平台运行在IOS的jscore引擎中,没有一个运行在浏览器或WebView中。
非h5端不支持windows、documents、navigator等浏览器的JS API,但也支持标准ECMAScript。
不要将浏览器的JS扩展对象等同于标准JS。
uni app的非h5端还支持标准JS、if、for等语法、字符串、数字、时间、布尔值、数组、自定义对象等变量类型和各种处理方法。仅支持特定于浏览器的对象,如窗口、文档和导航器。

Promise

对于异步方法,如果没有传入回调参数,如success、fail和complete,那么数据将作为promise返回。例如:uni getImageInfo()
该方法是异步的,并且有一个返回对象。如果要获取返回对象,必须传入至少一个回调参数,如success、fail、complete等。

    // 正常使用
    const task = uni.connectSocket(
        success(res){
            console.log(res)
        }
    )

    // Promise 化
    uni.connectSocket().then(res => {
            // 此处即为 success 回调的 res
            // 如果想获取 task ,则不要使用 Promise 化
            console.log(res)
    })

Uni app页面路由均由框架管理。开发人员需要使用JSON来配置每个路由页面的路径和页面样式(类似于app.JSON中配置页面路由的小程序)。

"pages": [
    {
      "path": "pages/index",
      "style": {
        "navigationBarTitleText": "金迅教育 · 路由配置",
        "navigationBarBackgroundColor": "#FFFFFF",
        "navigationBarTextStyle": "black",
        "backgroundColor": "#FFFFFF",
        "enablePullDownRefresh": true
      }
    },
    {
      "path": "pages/user",
      "style": {
        "navigationBarTitleText": "金迅教育 · 路由配置",
        "navigationBarBackgroundColor": "#FFFFFF",
        "navigationBarTextStyle": "black",
        "backgroundColor": "#FFFFFF",
        "enablePullDownRefresh": true
      }
    }
]

由于小程序的大小和资源加载限制,每个小程序平台都提供了一种分包方法来优化小程序的下载和启动速度。
所谓主包就是放置默认的启动页面/tabbar页面,所有分包都需要一些公共资源/js脚本;分包基于页面JSON配置。

生产环境

if(process.env.NODE_ENV === 'development'){
    console.log('开发环境')
}else{
    console.log('生产环境')
}
相关文章
|
2月前
|
开发框架 移动开发 JavaScript
SpringCloud微服务实战——搭建企业级开发框架(四十七):【移动开发】整合uni-app搭建移动端快速开发框架-添加Axios并实现登录功能
在uni-app中,使用axios实现网络请求和登录功能涉及以下几个关键步骤: 1. **安装axios和axios-auth-refresh**: 在项目的`package.json`中添加axios和axios-auth-refresh依赖,可以通过HBuilderX的终端窗口运行`yarn add axios axios-auth-refresh`命令来安装。 2. **配置自定义常量**: 创建`project.config.js`文件,配置全局常量,如API基础URL、TenantId、APP_CLIENT_ID和APP_CLIENT_SECRET等。
194 60
路由不跳转,只留在首页,写的样式写到了App.vue中,没使用router-view
路由不跳转,只留在首页,写的样式写到了App.vue中,没使用router-view
路由不跳转,只留在首页,写的样式写到了App.vue中,没使用router-view
|
2月前
|
开发框架 小程序 前端开发
uni-app前端应用开发框架
uni-app对做移动端开发的来说应该无人不知、无人不晓了吧?!从名字就能看出来这个框架要干啥,unify app——没错,就是统一前端应用开发,不管你是小程序、app、还是H5、公众号,用这个框架都能做。uni-app让开发者编写一套代码,就可以编译为安卓app、ios app、微信小程序、抖音小程序、支付宝小程序等十几个平台,而且马上支持纯血鸿蒙了,这简直是个人、开发工作室、小型开发公司的福音,开发一些常规的app、小程序,用这个框架足够了。
34 7
|
2月前
|
安全 测试技术 网络安全
APP攻防-资产收集篇&反证书检验&XP框架&反代理VPN&数据转发&反模拟器
APP攻防-资产收集篇&反证书检验&XP框架&反代理VPN&数据转发&反模拟器
|
2月前
|
安全 JavaScript 前端开发
kotlin开发安卓app,JetPack Compose框架,给webview新增一个按钮,点击刷新网页
在Kotlin中开发Android应用,使用Jetpack Compose框架时,可以通过添加一个按钮到TopAppBar来实现WebView页面的刷新功能。按钮位于右上角,点击后调用`webViewState?.reload()`来刷新网页内容。以下是代码摘要:
|
2月前
|
缓存 Android开发 Kotlin
【安卓app开发】kotlin Jetpack Compose框架 | 先用OKhttp下载远程音频文件再使用ExoPlayer播放
使用 Kotlin 的 Jetpack Compose 开发安卓应用时,可以结合 OkHttp 下载远程音频文件和 ExoPlayer 进行播放。在 `build.gradle` 添加相关依赖后,示例代码展示了如何下载音频并用 ExoPlayer 播放。代码包括添加依赖、下载文件、播放文件及简单的 Compose UI。注意,示例未包含完整错误处理和资源释放,实际应用需补充这些内容。
129 5
|
3月前
|
开发框架 移动开发 JavaScript
SpringCloud微服务实战——搭建企业级开发框架(四十六):【移动开发】整合uni-app搭建移动端快速开发框架-环境搭建
正如优秀的软件设计一样,uni-app把一些移动端常用的功能做成了独立的服务或者插件,我们在使用的时候只需要选择使用即可。但是在使用这些服务或者插件时一定要区分其提供的各种服务和插件的使用场景,例如其提供的【uni-starter快速开发项目模版】几乎集成了移动端所需的所有基础功能,使用非常方便,但是其许可协议只允许对接其uniCloud的JS开发服务端,不允许对接自己的php、java等其他后台系统。
264 61
|
3月前
|
Web App开发 Rust 前端开发
【一起学Rust | 框架篇 | Tauri2.0框架】Tauri App开启远程调试功能
【一起学Rust | 框架篇 | Tauri2.0框架】Tauri App开启远程调试功能
403 0
|
3月前
|
前端开发 JavaScript 搜索推荐
react-app框架——使用monaco editor实现online编辑html代码编辑器
react-app框架——使用monaco editor实现online编辑html代码编辑器
193 3
|
3月前
|
XML Java Android开发
Android Studio App开发之利用图片加载框架Glide实现刷新验证码功能(附源码 简单易懂)
Android Studio App开发之利用图片加载框架Glide实现刷新验证码功能(附源码 简单易懂)
43 0

热门文章

最新文章