组件开发--体验版(更易用的编辑器还在研发中)


在应用内开放组件开发的功能,开发完毕的组件可在当前应用内部使用,也可以下载后上传至组件市场供其它应用使用。

Tips:组件开发的功能只有《开发会员》的小伙伴才能使用哦!


开发组件的步骤如下(以小程序为例):

1.开启组件开发功能

在高级-->设置中先打开“开启源码编辑”开关,后打开“开启组件开发”的开关,两者都开启之后会在在页面栏目中的左边资源树里增加“组件包管理”目录。如下图所示:

2.新建组件包

鼠标移至组件包管理处,点击新建组件包图标,在弹出框中填写“名称”、“组件包类型”、“组件版本”、“组件描述”等信息,点击确定“myComp”组件包创建完毕。组件包新建后会在导航栏右侧出现下拉选择框,用于组件个应用的切换。如下图所示:

Tips:

  1. 组件包名称只能是字母和数字的组合,并且首字母不能为数字;

  2. 组件包类型目前支持小程序和APP;

  3. 组件版本为两段式版本号,如1.2,并确保小数位大于0。

新建组件包 组件包新建后

3.新建组件

鼠标移至“myComp”文件夹处,点击新建组件图标,在弹出框中填写“组件名称”、“组件标签”、“组件类型”、“命名空间”等信息,点击确定“firstComp”组件创建完毕,生成如下图所示的目录结构:

Tips:

  1. 组件名称由字母和数字组成;
  2. 命名空间为必填。
新建组件 组件目录结构

4.组件关键文件详解

  • (1)myComp.components.xml

该文件主要用于组件的注册,当前组件包中有几个组件,就要把这几个组件都注册到该文件中,例如将firstComp进行注册,注册后的组件可以在组件栏的市场中显示。

  • (2)server

组件服务端模板职责如下:

a.将输入XML转换成微信小程序展现片段;

b.根据输入的XML,结合组件实现的需要,收集部分信息,传递给运行时js类使用;

  • (3)firstComp.js

实现组件在运行时的功能。

  • (4)designer/firstComp.js

实现组件在设计时的功能。

  • (5)designer/firstComp.xml

配置组件在设计时的信息:属性、菜单项、事件等。

  • (6)firstComp.js.xdoc

组件帮助文件。

5.组件下载

点击myComp后的下载图标,下载组件包,通过市场中的上传组件将该组件上传至市场以供其他用户使用该组件。

results matching ""

    No results matching ""

    results matching ""

      No results matching ""