2.0.5 • Published 4 years ago
bee-clipboard v2.0.5
bee-clipboard
基于clipboard.js封装的复制组件
react bee-clipboard component for tinper-bee
复制组件
Browser Support
42+ ✔ | 12+ ✔ | 41+ ✔ | 9+ ✔ | 29+ ✔ | 10+ ✔ |
使用方法
import Clipboard from 'bee-clipboard';
class ClipboardDemo extends Component {
render() {
function success() {
console.log('success');
}
function error() {
console.log('error');
}
return (
<Clipboard action="copy" text="我将被复制到剪切板" success={success} error={error}>
</Clipboard>
)
}
}
样式引入
- 可以使用link引入build目录下Clipboard.css
<link rel="stylesheet" href="./node_modules/bee-clipboard/build/Clipboard.css">
- 可以在js中import样式
import "./node_modules/bee-clipboard/src/Clipboard.scss"
//或是
import "./node_modules/bee-clipboard/build/Clipboard.css"
API
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
action | 方法,可以传copy 或者cut ,cut 只支持textarea | string | copy |
text | 要复制的文本内容 | string | - |
target | 要复制内容的目标元素,可传选择器,如果选择器得出多个,会取第一个 | string /dom选择器 | - |
success | 复制成功之后的回调函数 | function | - |
error | 复制失败之后的回调函数 | function | - |
locale | 设置默认文字语言 | object | 中文 |
多语设置
通过给Clipboard组件设置locale语言对象。
如:
export default {
lang: 'zh-cn',
copy: '复制',
cut: '剪切',
copyReady: '已复制',
cutReady: '已剪切'
}
组件内默认中文,提供英文包。
import en from 'bee-clipboard/build/en_US.js';
开发调试
$ npm install -g bee-tools
$ git clone https://github.com/tinper-bee/bee-clipboard
$ cd bee-clipboard
$ npm install
$ npm run dev
2.0.5
4 years ago
2.0.4
4 years ago
2.0.3
4 years ago
2.0.2
5 years ago
2.0.1
5 years ago
2.0.0
5 years ago
1.0.7
6 years ago
1.0.6
6 years ago
1.0.5
6 years ago
1.0.4
6 years ago
1.0.3
6 years ago
1.0.2
6 years ago
1.0.1
7 years ago
1.0.0
7 years ago
0.1.7
7 years ago
0.1.6
7 years ago
0.1.5
7 years ago
0.1.4
7 years ago
0.1.3
7 years ago
0.1.2
7 years ago
0.1.1
7 years ago