Codesign-js-sdk NPM

codesign-js-sdk 提供 CoDesign 平台部分能力，方便第三方应用接入。目前支持 Picker 组件，提供设计稿选择列表。Demo 体验

接入流程

NPM 包

npm install codesign-js-sdk

import { Picker } from 'codesign-js-sdk'
const picker = new Picker(config)

CDN 链接

https://cdn.codesign.qq.com/pkg/codesign-js-sdk/latest/codesign-js-sdk.min.js

Picker 组件

使用方式

// 1. 不包含弹窗
const picker = new codesign.Picker({
  modal: false,
  width: 600,
  height: 480
})
picker.show()
picker.getData().then(data => {}).catch(err => {})

// 2. 包含弹窗
const picker = new codesign.Picker({
  width: 600,
  height: 480
})
picker.on('ready', (e) => {})
picker.on('confirm', (data) => {})
picker.on('selectChange', (data) => {})
picker.on('error', (data) => {})
picker.on('cancel', () => {})

Config 参数：

参数名	类型	描述	默认值
width	Number	宽	600
height	Number	高	480
modal	Boolean	是否显示弹窗容器	true
range	String	选择范围: group / artboard	artboard
limit	Number	数量限制：-1 表示不限制数量 / 1 表示单选 / 值大于 1 表示最大限制（range 为 group 时只支持单选）	-1
type	String	获取数据内容类型：sharing 返回分享链接 / screenshot 返回画板图片信息	screenshot
domain	String	服务域名： codesign.qq.com / 私有化部署域名	codesign.qq.com
app	String	第三方应用标识（需提前与 CoDesign 沟通标识名称与请求 origin），如：tapd / coding / pixel

API

show

显示设计稿选择组件

参数：parent 父容器

destory

销毁实例

getData

获取数据（modal 为 false 时可调用）

返回值：Promise 对象

const data = await picker.getData()

on

监听组件事件

参数：

参数名	类型	描述
event	Event	事件名
handler	Function	监听函数

off

移除事件监听

事件

ready

页面加载完成

selectChange

选择内容发生变化

picker.on('selectChange', data => {})

返回的数据内容如下：

{
  "name": '',
  "count": 1,
}

confirm

组件弹窗底部“确认”点击事件获取数据（modal 为 true 时）

picker.on('confirm', data => {})

type 为 sharing 时，返回的数据内容如下:

{
  "title": "分组名称",
  "range": "group",
  "type": "sharing",
  "data": {
    "count": 2,
    "url": "https://codesign.qq.com/s/xxxx"
  }
 
}

type 为 screenshot 时，返回的数据内容如下：

{
  "title": "",
  "range": "artboard",
  "type": "screenshot",
  "data": [
    {
      "name": "",
      "url": "",
      "thumb_url": "",
    }
  ]
}

error

错误信息

empty, 未选择设计稿
limit, 超出数量限制
param, 参数有误
cancel, 弹窗取消事件
notallow, 不允许请求（targetOrigin 不在白名单内）

@everything-registry/sub-chunk-1351 @zalastax/nolb-codes

1.0.11

1 year ago

1.0.10

2 years ago

1.0.9

2 years ago