mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-24 19:19:57 +08:00
Code Issues Actions 31 Packages Projects Releases Wiki Activity

update badge number

Browse Source
This commit is contained in:
jljsj 2015-11-20 16:00:59 +08:00
parent b08513a082
commit 7ce4a11d62
2 changed files with 13 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
components/badge/AntNumber.jsx
View File

@ -1,4 +1,4 @@
import React, {createElement, cloneElement} from 'react'; import React, {createElement} from 'react';
import {findDOMNode} from 'react-dom'; import {findDOMNode} from 'react-dom';
import {toArrayChildren, getPartNumber, getTranslateY} from './utils'; import {toArrayChildren, getPartNumber, getTranslateY} from './utils';
import assign from 'object-assign'; import assign from 'object-assign';
@ -16,7 +16,7 @@ class AntNumber extends React.Component {
}; };
} }
getNumberOnly(c) { getNumberOnly(c, style) {
const childrenToReturn = []; const childrenToReturn = [];
for (let i = 0; i < 30; i++) { for (let i = 0; i < 30; i++) {
let count = i >= 10 ? i % 10 : i; let count = i >= 10 ? i % 10 : i;
@ -24,7 +24,7 @@ class AntNumber extends React.Component {
childrenToReturn.push(children); childrenToReturn.push(children);
} }
const key = 'only_' + c; const key = 'only_' + c;
return createElement('span', {className: `${this.props.prefixCls}-only`, key: key}, childrenToReturn); return createElement('span', {className: `${this.props.prefixCls}-only`, style: style, key: key}, childrenToReturn);
} }
setEndState(style) { setEndState(style) {
@ -39,27 +39,23 @@ class AntNumber extends React.Component {
} }
const length = count.toString().length; const length = count.toString().length;
const data = getPartNumber(count); const data = getPartNumber(count);
const height = findDOMNode(this).offsetHeight;
let childrenWap = []; let childrenWap = [];
let i = 0; let i = 0;
while (i < length) { while (i < length) {
const children = this.getNumberOnly(i); const oneData = Number(count.toString()[i]);
childrenWap.unshift(children);
i++;
}
const height = findDOMNode(this).offsetHeight;
const _length = childrenWap.length - 1;
childrenWap = childrenWap.map((child, j)=> {
const oneData = Number(count.toString()[j]);
const style = {}; const style = {};
let translateY = -(oneData + 10) * height; let translateY = -(oneData + 10) * height;
//判断状态 //判断状态
translateY = getTranslateY(count, this.count, data, this.data, j, height, _length) || translateY; translateY = getTranslateY(count, this.count, data, this.data, i, height, length - 1) || translateY;
if (count !== this.count) { if (count !== this.count) {
this.setEndState(style); this.setEndState(style);
} }
style.transform = 'translateY(' + translateY + 'px)'; style.transform = `translateY(${translateY}px)`;
return cloneElement(child, {style: style}); const children = this.getNumberOnly(i, style);
}); childrenWap.push(children);
i++;
}
this.data = data; this.data = data;
this.count = count; this.count = count;
return childrenWap; return childrenWap;
@ -106,7 +102,7 @@ class AntNumber extends React.Component {
render() { render() {
const childrenToRender = this.state.children; const childrenToRender = this.state.children;
const props = assign({}, this.props, {className: this.props.prefixCls + ' ' + this.props.className}); const props = assign({}, this.props, {className: `${this.props.prefixCls} ${this.props.className}`});
return createElement(this.props.component, props, childrenToRender); return createElement(this.props.component, props, childrenToRender);
} }
} }

2
components/badge/demo/change.md
View File

@ -13,7 +13,7 @@ const ButtonGroup = Button.Group;
const Test = React.createClass({ const Test = React.createClass({
getInitialState() { getInitialState() {
return { return {
count: 19, count: 5,
show: true, show: true,
}; };
}, },