新闻| 文章| 资讯| 行情| 企业| wap手机版| article文章| 首页|会员中心|保存桌面|手机浏览
普通会员

宁波市鄞州银环塑胶机械配件厂

宁波市鄞州银环塑胶机械配件厂,其他橡胶制品,橡胶片,工业用橡胶制品,塑料加工,其他...

2.7.2.3 公共对象

2.7.2.4 应用对象

可通过访问

2.7.2.5 页面对象

可通过访问

2.7.3 方法

2.7.3.1 数据方法

2.7.3.2 公共方法

2.7.3.3 事件方法

2.7.3.4 应用方法

可通过$app访问

2.7.3.5 页面方法

可通过访问

for

指令用于循环输出一个数组类型的数据

指令if与指令show

组件block

block组件是表达逻辑区块的组件,没有对应的Native组件。可以使用<block>实现更为灵活的"列表/条件渲染"。如在<block>上使用for指令和if指令

组件slot

slot节点用于向开发者额外开发的自定义ux组件中插入内容

在子组件中使用组件,使得子组件接纳调用者传入的子内容,从而动态渲染子组件,得到最终的页面

当前为APP的生命周期提供了两个回调函数:, ;可在中定义回调函数

image.png

在中,通过访问中定义的数据和方法

关于app.$def

image.png

onInit()

表示ViewModel的数据已经准备好,可以开始使用页面中的数据

onReady()

表示ViewModel的模板已经编译完成,可以开始获取DOM节点(如:this.$element(idxxx)

onShow(), onHide()

页面被切换隐藏时调用onHide(),页面被切换重新显示时调用onShow()

onDestroy()

页面被销毁时调用,被销毁的可能原因有:用户从当前页面返回到上一页,或者用户打开了太多的页面,框架自动销毁掉部分页面,避免占用资源

onBackPress()

当用户点击返回实体按键、左上角返回菜单、调用返回API时触发该事件

返回上一页的接口API

onMenuPress()

当使用原生的顶部标题栏时,可以通过manifest.json中的menu属性配置是否显示右上角的菜单

A页面的生命周期接口的调用顺序

参数属性包括

注意,获取元素应该在页面已渲染后,如 onReady 事件中或 onReady 事件执行完以后

布局和尺寸

CSS

、、、组件为文本容器组件,其它组件不能直接放置文本内容

: 和 HTML 一样

支持样式 flex-direction, flex-wrap, justify-content, align-items, align-content

: 气泡框

: 下拉刷新

: 富文本编辑器

更多详情 https://doc.quickapp.cn/widgets/div.html

传递方法1

标签配合 传递参数, 这个和前端一致

传递方法2

通过 接口:, , 接受一个如下结构的对象,用法这个和前端 一致。

接收参数

上述2种传递参数的方法,其接收方法一致,在接收参数页面的 对象中获取即可(可设置默认值

回传参数

开发者可能会遇到需要在页面之间回传参数的需求

页面A实现代码如下

页面B实现代码如下

https://doc.quickapp.cn/framework/script.html

会利用到一个构造函数 , 它接受一个字符串参数,作为实例的频道名称。它的实例具有以下属性和方法

其中 事件有2个属性(通过 对象访问)

父组件到子组件

子组件到父组件

配合标签框架支持通过链接从外部打开应用,格式

从传统网页调起需引入以下脚本

用于监听自定义事件;移除对应的事件监听

$on(evtName, fnHandler)

在当前页面注册监听事件, 可监听、 、 等触发的自定义事件,不能用于注册组件节点的事件响应

$off(evtName, fnHandler)

移除事件监听,参数 fnHandler 为可选,传递仅移除指定的响应函数,不传递则移除此事件的所有监听

触发ViewModel事件

页面的交互中可能会遇到一些非手动触发的需求,$emit() 通过触发当前实例上的事件达到动态触发事件的行为

$emit(evtName, evtDetail)

监听原生组件事件

触发原生组件事件

通过完成事件的动态触发

可以触发指定组件的事件,通过获取传递的参数;该方法对自定义组件无效

1)编译打包工程

2)增加 release 签名

通过 命令等工具生成签名文件、,例如

https://doc.quickapp.cn/tools/compiling-tools.html

在工程的 目录下创建 目录,将私钥文件 和证书文件 拷贝进去

3)发布程序包

发布程序包前需要增加签名,然后在工程的根目录下运行

image

image

快应用注册账号 https://www.quickapp.cn/docCenter/post/74

image.png

企业列表
新闻列表
  • 暂无新闻
推荐企业新闻
联系方式
  • 联系人:张磊
  • 电话:86 0574 88406337
首页 > 新闻中心 > 快应用简介
新闻中心
快应用简介
发布时间:2024-11-10        浏览次数:0        返回列表

快应用是一种新的应用形态,以往的手机端应用主要有两种方式:网页、原生应用;网页无需安装,却体验不是很好;原生应用体验流畅,却需要从应用商店下载安装,难以一步直达用户;快应用的出现,就是希望能够让用户无需下载安装,并且还能流畅的体验应用内容。

快应用简介

为了达到上面的目标,快应用建立一种新的语言开发规范,同时提供一系列的开发套件辅助支持。简单来说,开发者主要利用前端知识与技能,以及对应的IDE,手机设备就可以做原型的开发。快应用使用前端技术栈开发,原生渲染,同时具备H5与原生应用的双重优点,开发者使用的前端技术栈资料多,学习成本底。

2018年3月份,由小米,OPPO,VIVO,华为等10家国内主流厂商成立了快应用联盟,从技术规范层面做了统一,并保证了开发者开发的快应用可以直接在所有的联盟内厂商的手机设备上运行。

快应用框架深度集成进各手机厂商的手机操作系统中,可以在操作系统层面形成用户需求与应用服务的无缝连接,很多只用在原生应用中才能使用的功能,在快应用中可以很方便的实现,享受原生应用体验,同时不用担心分发留存等问题,资源消耗也比较少。

对于每台手机设备,应用可以从多个系统入口,引用用户体验产品。比如:全局搜索、负一屏、浏览器搜索等。

 

  • 二者都采用前端技术栈,快应用是 渲染,性能体验会比较好,而小程序目前是渲染
  • 二者开发框架和规范不同,所以代码写法上有差异,快应用的支持能力较弱
  • 快应用基于,可以调起丰富的系统api,小程序在此方面会有些无力
  • 应用商店
  • 桌面图标
  • 全局搜索
  • 浏览器搜索
  • 网页跳转
  • 负一屏
  • 智能推送
  • 智慧识屏
  • 场景化入口(短信按钮、应用卸载替换、二维码、传送门
  • 轻松调起更多系统api
  • 各厂商的流量扶持
  • 渲染,入口,原生桌面入口,能力

需安装以上版本的

生成的目录结构

  • :项目源文件夹
  • :签名模块,当前仅有签名,如果内测上线,请添加文件夹,增加线上签名;签名生成方法详见文档编译工具

编译项目

  • # 发布程序包,在 ,注意需要使用 签名模块
  • # 生成 和 两个目录。前者是临时产出,后者是最终产出
  • # 文件保存时自动编译和调试

手动编译项目

在项目的根目录下,运行如下命令进行编译打包,生成rpk包

  • 编译打包成功后,项目根目录下会生成文件夹:、
  • :临时产出,包含编译后的页面js,图片等
  • :最终产出,包含文件。其实是将目录下的资源打包压缩为一个文件,后缀名为,这个文件就是项目编译后的最终产出

自动编译项目

  • 每次修改源代码文件后,都自动编译项目

在安卓手机上安装调试工具

https://www.quickapp.cn/docCenter/post/69

image.png

注意:一定要注意手机连接的wifi与电脑所连接的网络需要在同一局域网和网段,需要能够相互访问。

  • 在项目根目录下执行如下命令,启动HTTP调试服务器(前需要先
  • 开发者可以通过命令行终端或者调试服务器主页看到提供扫描的二维码
  • 开发者通过快应用调试器扫码安装按钮,扫码安装待调试的文件
  • 开发者点击快应用调试器中的开始调试按钮,开始调试

打开之前安装的快应用调试助手扫描即可预览

image.png

扫描二维码之后点击开始调试,会调出devtool工具本地调试

image.png

image.png

启动Visual Studio Code,打开项目,点击左上侧扩展,搜索hap,点击安装Hap Extension

  • 更多详情 https://doc.quickapp.cn/tutorial/getting-started/code-edit-conf.html

一个应用包含:描述项目配置信息的文件,放置项目公共资源脚本的文件,多个描述页面/自定义组件的ux文件

目录的简要说明如下

  • :项目源文件夹
  • :签名模块(当前仅有签名,如果内测上线,请添加文件夹,增加线上签名

,页面和自定义组件均通过文件编写,文件由模板、样式和脚本3个部分组成,一个典型的页面文件示例如下

https://doc.quickapp.cn/framework/manifest.html

  • 应用包名,确认与原生应用的包名不一致,推荐采用的格式,如
  • 应用名称,6个汉字以内,与应用商店保存的名称一致,用于在桌面图标、弹窗等处显示应用名称
  • 应用图标,提供大小的即可
  • 应用版本名称,如
  • 应用版本号,从1自增,推荐每次重新上传包时
  • 支持的最小平台版本号,兼容性检查,避免上线后在低版本平台运行并导致不兼容;如果不填按照内测版本处理
  • 接口列表,绝大部分接口都需要在这里声明,否则不能调用,详见每个接口的文档说明
  • 系统配置
    • :打印日志等级,分为,,,,,
    • :页面设计基准宽度,根据实际设备宽度来缩放元素大小
  • 路由信息
    • 首页名称
    • :页面配置列表,值为页面名称(对应页面目录名,例如Hello对应'Hello'目录,为页面详细配置,详见下面说明
    • 用于定义单个页面路由信息
      • : 页面对应的组件名,与文件名保持一致,例如 对应
      • 页面路径,例如,不填则默认为/<页面名称>。必须唯一,不能和其他的相同。下面的因为缺失,会被设置为::
      • : 声明页面可以处理某种请求
  • 显示相关配置
    • 窗口背景颜色
    • 是否是全屏模式,默认不会同时作用于,需要继续通过控制
    • 是否显示
    • 标题栏背景色
    • 标题栏文字颜色
    • 标题栏文字(也可通过页面跳转传递参数()设置)
    • 是否显示标题栏右上角菜单按钮
    • 各个页面的显示样式,key为页面名(与路由中的页面名保持一致,为窗口显示

当前编译后会包含配置信息(可以在之后查看文件内容,所以请不要删除的注释内容标识

  • 您可以在中引入一些公共的脚本,并暴露在当前app的对象上,如下所示,然后就可以在页面ux文件的中,通过访问
  • 样式布局采用(弹性盒)样式

支持2种导入外部文件的方式

模板内部样式

样式预编译

目前支持less, sass的预编译

2.7.1 模块声明

可以通过引入功能模块,在代码中调用模块方法

也可以一次引入所有的模块,例如

  • 在代码中使用来调用接口方法

2.7.2 对象

2.7.2.1 页面级组件

data(废弃)

  • 页面级组件的数据模型,能够转换为对象
  • 如果是函数,返回结果必须是对象,在组件初始化时会执行函数获取结果作为的值
  • 使用方式声明的属性会被外部数据覆盖,因此存在一定安全风险,推荐使用下面的,,来声明属性(注意:它们不能与data同时声明

public

页面级组件的数据模型,影响传入数据的覆盖机制:内定义的属性允许被传入的数据覆盖,如果外部传入数据的某个属性未被声明,在中不会新增这个属性

protected

页面级组件的数据模型,影响传入数据的覆盖机制:protected内定义的属性,允许被应用内部页面请求传递的数据覆盖,不允许被应用外部请求传递的数据覆盖

private

页面级组件的数据模型,影响传入数据的覆盖机制:private内定义的属性不允许被覆盖

2.7.2.2 自定义组件

data

自定义组件的数据模型,能够转换为JSON对象;属性名不能以$或_开头, 不要使用for, if, show, tid等保留字 如果是函数,返回结果必须是对象,在组件初始化时会执行函数获取结果作为data的值

props

  • 定义组件外部可传入的所有属性
  • 在模板代码中,请使用短横线分隔命名代替驼峰命名。如,属性定义,可通过方式传递到组件内部

prop验证

在自定义组件中,可将props定义为带验证需求的对象。其中,key为属性名,value为属性对应的验证需求。验证失败则输出错误提示日志,增加prop验证有利于规范自定义组件的使用

属性类型描述
-检查属性值的类型。支持单一类型和多种可能类型,可在原生和自定义构造函数中任意选择,单独或组合使用。原生构造函数
-设置属性的默认值
设置属性是否必填
设置自定义验证函数。若函数的返回值为真,则通过验证;否则验证失败
属性类型描述
应用对象
页面对象
页面对象是否有效
页面是否处于用户可见状态
属性类型描述
使用获取在中暴露的对象
使用获取在的中声明的全局数据
属性类型描述
n获取打开当前页面的。仅在当前页面是通过匹配的方式打开时有效,否则为
获取打开当前页面的uri。仅在当前页面是通过filter匹配的方式打开时有效,否则为
属性类型参数描述
添加数据属性,用法
删除数据属性,用法
属性描述
获取指定的组件对象,如果没有指定,则返回根组件对象用法: 获取为的组件实例对象 获取根组件实例对象
获取顶层
获取父亲
获取指定的自定义组件的用法: 获取为的组件
请使用上面替代
请使用上面替代
更新数据,可能会触发操作,如:创建节点、更新节点、删除节点等;这些DOM操作不一定在数据更新时立即执行,而是在开发者的业务代码执行后触发;若开发者期望数据更新时立即执行相应的操作,可使用;一般不推荐使用
属性参数描述
事件名事件句柄函数添加事件处理句柄用法: 是在中定义的函数
事件名: 事件句柄函数删除事件处理句柄用法: 删除指定事件的所有处理句柄
事件名向上层组件发送事件通知用法:正常情况下,会一直向上传递事件(冒泡)如果要停止冒泡,在事件句柄函数中调用即可
事件名向子组件发送事件通知用法:正常情况下,会一直向下传递事件如果要停止传递,在事件句柄函数中调用即可
事件名 事件参数触发事件,对应的句柄函数被调用用法:传递的事件参数可在事件回调函数中,通过来访问,例如
事件名 事件参数 组件 (默认为 代表根元素)触发组件事件,对应的句柄函数被调用用法:传递的事件参数可在事件回调函数中,通过来访问,例如
属性名, 支持格式,不支持数组索引 事件句柄函数名,函数的第一个参数为新的属性值,第二个参数为旧的属性值动态添加属性/事件绑定,属性必须在中定义,函数必须在定义;当属性值发生变化时事件才被触发用法
属性描述
exit退出快应用,结束应用生命周期。 调用方法
属性参数描述
标题栏文字 文字颜色 背景颜色背景透明度 是否在标题栏右上角显示菜单按钮设置当前页面的标题栏用法
从本页面退出,结束页面生命周期。调用方法