README
smart-link 二维码分享组件
smart-link 二维码分享组件
何时使用
- 需要分享内容, 并智能适配当前使用设备的时候
浏览器支持
ie9+
安装
npm install smart-link --save
<script src="[静态站host]/auxo/component/js-smart-link/smart-link.js" ></script>
运行
# 默认开启服务器,地址为 :http://localhost:8000/
# 能在ie9+下浏览本站,修改代码后自动重新构建,且能在ie10+运行热更新,页面会自动刷新
npm run start
# 构建生产环境静态文件,用于发布文档
npm run site
代码演示
基本
基本用法。
import SmartLink from 'smart-link'
class App extends React.Component {
componentDidMount () {
const smartlinkInstance = new SmartLink('#container-1', {
sdpAppId: '3360407a-6f91-4aaa-a6b7-dd7fc58e29d6',
producerCode: 'train',
qrcodeOptions: {
width: 200
},
linkQuery: [
{
key: 'trainId',
value: '4061afd7-646e-43c5-afc1-527630ad3c1c'
}
],
env: 'test', // 可不传,不传默认为test环境
failCallback: function() {
// do something
},
success: function() {
// do something
}
})
smartlinkInstance.getLinks().then(function(res) {
console.log(res)
})
}
render() {
return (
<div id="container-1"></div>
);
}
}
ReactDOM.render(<App />, mountNode);
API
new SmartLink(selector, options)
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
options | 配置参数 | SmartLink.options | { qrcodeOptions: { width: 160 } } |
selector | css选择器 |
options
配置参数如下
参数 | 说明 | 类型 | 默认值 | 是否必传 |
---|---|---|---|---|
sdpAppId | 产品id | |||
producerCode | 生产者Code | |||
env | 当前环境, 可取值test/preproduction/production/hk/awsca | |||
linkQuery | 将会替换inner_link中的占位符,[{ key: '', value: ''}] | |||
qrcodeOptions | 二维码样式配置, 目前支持width配置 | { width: 160 } | ||
failCallback | 创建失败回调 | |||
success | 创建成功回调 |
方法
方法 | 说明 | 返回值 |
---|---|---|
getLinks | 获取smartlink地址对象, 包含长连接和短链接 promise | promise |
编译和部署
在公网npmjs建立账号,由管理员添加到开发者。
npm run dist
修改.npmrc,确保能连接到公网npmjs,登录公网npm
npm login
npm version patch
npm public