From 4c8f08f457d625445273a579834f087abbad6885 Mon Sep 17 00:00:00 2001
From: BoyuZhou <386607913@qq.com>
Date: Tue, 29 Aug 2017 19:16:00 +0800
Subject: [PATCH] fix
---
.idea/inspectionProfiles/Project_Default.xml | 6 +
.idea/misc.xml | 38 ++
.idea/modules.xml | 8 +
.idea/tinper-bee-core.iml | 12 +
.idea/vcs.xml | 6 +
.idea/workspace.xml | 540 +++++++++++++++++++
README.md | 83 +++
js/Align.js | 39 +-
lib/keyCode.js | 10 +-
9 files changed, 713 insertions(+), 29 deletions(-)
create mode 100644 .idea/inspectionProfiles/Project_Default.xml
create mode 100644 .idea/misc.xml
create mode 100644 .idea/modules.xml
create mode 100644 .idea/tinper-bee-core.iml
create mode 100644 .idea/vcs.xml
create mode 100644 .idea/workspace.xml
diff --git a/.idea/inspectionProfiles/Project_Default.xml b/.idea/inspectionProfiles/Project_Default.xml
new file mode 100644
index 0000000..c6cc8c8
--- /dev/null
+++ b/.idea/inspectionProfiles/Project_Default.xml
@@ -0,0 +1,6 @@
+
+
+
+
+
+
\ No newline at end of file
diff --git a/.idea/misc.xml b/.idea/misc.xml
new file mode 100644
index 0000000..60d81e9
--- /dev/null
+++ b/.idea/misc.xml
@@ -0,0 +1,38 @@
+
+
+
+
+
+
+ true
+
+ false
+ true
+
+
+
+
+
+
+
+
+
+ CSS
+
+
+ Code quality toolsCSS
+
+
+ GeneralJavaScript
+
+
+ JavaScript
+
+
+ Node.jsJavaScript
+
+
+
+
+
+
\ No newline at end of file
diff --git a/.idea/modules.xml b/.idea/modules.xml
new file mode 100644
index 0000000..1a9d85c
--- /dev/null
+++ b/.idea/modules.xml
@@ -0,0 +1,8 @@
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/.idea/tinper-bee-core.iml b/.idea/tinper-bee-core.iml
new file mode 100644
index 0000000..24643cc
--- /dev/null
+++ b/.idea/tinper-bee-core.iml
@@ -0,0 +1,12 @@
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
new file mode 100644
index 0000000..94a25f7
--- /dev/null
+++ b/.idea/vcs.xml
@@ -0,0 +1,6 @@
+
+
+
+
+
+
\ No newline at end of file
diff --git a/.idea/workspace.xml b/.idea/workspace.xml
new file mode 100644
index 0000000..876ee5c
--- /dev/null
+++ b/.idea/workspace.xml
@@ -0,0 +1,540 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ true
+ DEFINITION_ORDER
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ project
+
+
+ true
+
+
+
+ DIRECTORY
+
+ false
+
+
+
+
+
+
+
+
+
+ 1503105208947
+
+
+ 1503105208947
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/README.md b/README.md
index b1b4d91..2c1da86 100644
--- a/README.md
+++ b/README.md
@@ -71,3 +71,86 @@ tinper-bee组件库的核心样式及公用方法库
- 阴影
- 常用z-index值设定
- UI组件的预设
+
+
+
+### js方法
+
+#### keyCode对象
+
+引入方法：
+
+```
+import keyCode from 'tinper-bee-core/lib/keyCode';
+
+//或者
+
+import { keyCode } from 'tinper-bee-core';
+
+```
+
+方法：
+
+- isTextModifyingKeyEvent 验证是否是特殊按键或组合按键
+
+```
+handleKeyDown = (e) => {
+if(keyCode.isTextModifyingKeyEvent(e)){
+ //一些操作
+}
+}
+...
+
+
+```
+
+- isCharacterKey 验证是否是文本键
+```
+handleKeyDown = (e) => {
+if(keyCode.isCharacterKey(e)){
+ //一些操作
+}
+}
+...
+
+
+```
+
+#### toArray 将数组安全的转换为react element 数组
+
+#### splitComponentProps 通过父组件的propTypes拆分分别传给父子组件的props
+
+
+```
+const propTypes = {
+ color: PropTypes.string,
+ size: PropTypes.string
+}
+class ParentClass extends React.Component{
+ render() {
+ let props = this.props;
+ let [parentProps, childProps] = splitComponentProps(props);
+
+ return (
+
+
+
+ )
+ }
+}
+
+ParentClass.propTypes = propTypes;
+
+```
+
+#### createChainedFunction 创建链式调用方法
+
+用法：
+```
+
+```
+
+#### contains 检验是否包含
+
+####
+
diff --git a/js/Align.js b/js/Align.js
index e10d3f1..d130f57 100644
--- a/js/Align.js
+++ b/js/Align.js
@@ -1,6 +1,5 @@
-import React, { PropTypes } from 'react';
+import React, { PropTypes, Component } from 'react';
import ReactDOM from 'react-dom';
-import createReactClass from 'create-react-class';
import align from 'dom-align';
import addEventListener from './addEventListener';
//import isWindow from './isWindow';
@@ -31,8 +30,8 @@ function buffer(fn, ms) {
return bufferFn;
}
-const Align = React.createClass({
- propTypes: {
+class Align extends Component{
+ static propTypes = {
childrenProps: PropTypes.object,
align: PropTypes.object.isRequired,
target: PropTypes.func,
@@ -41,20 +40,18 @@ const Align = React.createClass({
monitorWindowResize: PropTypes.bool,
disabled: PropTypes.bool,
children: PropTypes.any,
- },
+ };
- getDefaultProps() {
- return {
+ static defaultProps = {
target() {
- return window;
+ return window;
},
onAlign() {
},
monitorBufferTime: 50,
monitorWindowResize: false,
disabled: false,
- };
- },
+ }
componentDidMount() {
const props = this.props;
@@ -63,7 +60,7 @@ const Align = React.createClass({
if (!props.disabled && props.monitorWindowResize) {
this.startMonitorWindowResize();
}
- },
+ }
componentDidUpdate(prevProps) {
let reAlign = false;
@@ -92,34 +89,34 @@ const Align = React.createClass({
} else {
this.stopMonitorWindowResize();
}
- },
+ }
componentWillUnmount() {
this.stopMonitorWindowResize();
- },
+ }
- startMonitorWindowResize() {
+ startMonitorWindowResize = () => {
if (!this.resizeHandler) {
this.bufferMonitor = buffer(this.forceAlign, this.props.monitorBufferTime);
this.resizeHandler = addEventListener(window, 'resize', this.bufferMonitor);
}
- },
+ }
- stopMonitorWindowResize() {
+ stopMonitorWindowResize = () => {
if (this.resizeHandler) {
this.bufferMonitor.clear();
this.resizeHandler.remove();
this.resizeHandler = null;
}
- },
+ }
- forceAlign() {
+ forceAlign = () => {
const props = this.props;
if (!props.disabled) {
const source = ReactDOM.findDOMNode(this);
props.onAlign(source, align(source, props.target(), props.align));
}
- },
+ }
render() {
const { childrenProps, children } = this.props;
@@ -134,7 +131,7 @@ const Align = React.createClass({
return React.cloneElement(child, newProps);
}
return child;
- },
-});
+ }
+};
export default Align;
diff --git a/lib/keyCode.js b/lib/keyCode.js
index d3f44f8..7d3b325 100644
--- a/lib/keyCode.js
+++ b/lib/keyCode.js
@@ -1,10 +1,4 @@
-'use strict';
-/**
- * @ignore
- * some key-codes definition and utils from closure-library
- * @author yiminghe@gmail.com
- */
var KeyCode = {
/**
@@ -430,7 +424,7 @@ var KeyCode = {
};
/*
- whether text and modified key is entered at the same time.
+ 是否是同时输入文本和特殊的按键的组合键
*/
KeyCode.isTextModifyingKeyEvent = function isTextModifyingKeyEvent(e) {
var keyCode = e.keyCode;
@@ -473,7 +467,7 @@ KeyCode.isTextModifyingKeyEvent = function isTextModifyingKeyEvent(e) {
};
/*
- whether character is entered.
+ 是否是文本按键
*/
KeyCode.isCharacterKey = function isCharacterKey(keyCode) {
if (keyCode >= KeyCode.ZERO && keyCode <= KeyCode.NINE) {