upgrade eslint-config-airbnb version and fix some problems

This commit is contained in:
afc163 2016-04-29 12:13:27 +08:00
parent ce123137e3
commit 03cb74ead5
51 changed files with 376 additions and 364 deletions

View File

@ -30,6 +30,8 @@ const eslintrc = {
'react/sort-comp': 0,
'react/prop-types': 0,
'react/jsx-closing-bracket-location': 0,
'react/jsx-first-prop-new-line': 0,
'import/no-unresolved': 0,
'no-param-reassign': 0,
'no-return-assign': 0,
'max-len': 0,

View File

@ -9,6 +9,6 @@ title: 自定义关闭
import { Alert } from 'antd';
ReactDOM.render(
<Alert message="消息提示的文案" type="info" closeText="不再提醒" />
<Alert message="消息提示的文案" type="info" closeText="不再提醒" />
, mountNode);
````

View File

@ -12,55 +12,54 @@ import { Button, Icon } from 'antd';
const ButtonGroup = Button.Group;
ReactDOM.render(<div>
<h4>基本组合</h4>
<ButtonGroup>
<Button type="primary">确定</Button>
<Button type="primary">取消</Button>
</ButtonGroup>
<ButtonGroup>
<Button disabled></Button>
<Button disabled></Button>
<Button disabled></Button>
</ButtonGroup>
<ButtonGroup>
<Button type="primary"></Button>
<Button type="ghost"></Button>
<Button type="ghost"></Button>
<Button></Button>
</ButtonGroup>
<h4>基本组合</h4>
<ButtonGroup>
<Button type="primary">确定</Button>
<Button type="primary">取消</Button>
</ButtonGroup>
<ButtonGroup>
<Button disabled></Button>
<Button disabled></Button>
<Button disabled></Button>
</ButtonGroup>
<ButtonGroup>
<Button type="primary"></Button>
<Button type="ghost"></Button>
<Button type="ghost"></Button>
<Button></Button>
</ButtonGroup>
<h4>带图标按钮组合</h4>
<ButtonGroup>
<Button type="primary">
<Icon type="left" />后退
</Button>
<Button type="primary">
前进<Icon type="right" />
</Button>
</ButtonGroup>
<ButtonGroup>
<Button type="primary" icon="cloud" />
<Button type="primary" icon="cloud-download" />
</ButtonGroup>
<h4>带图标按钮组合</h4>
<ButtonGroup>
<Button type="primary">
<Icon type="left" />后退
</Button>
<Button type="primary">
前进<Icon type="right" />
</Button>
</ButtonGroup>
<ButtonGroup>
<Button type="primary" icon="cloud" />
<Button type="primary" icon="cloud-download" />
</ButtonGroup>
<h4>尺寸</h4>
<ButtonGroup size="large">
<Button type="ghost"></Button>
<Button type="ghost"></Button>
<Button type="ghost"></Button>
</ButtonGroup>
<ButtonGroup>
<Button type="ghost">默认</Button>
<Button type="ghost">默认</Button>
<Button type="ghost">默认</Button>
</ButtonGroup>
<ButtonGroup size="small">
<Button type="ghost"></Button>
<Button type="ghost"></Button>
<Button type="ghost"></Button>
</ButtonGroup>
</div>
, mountNode);
<h4>尺寸</h4>
<ButtonGroup size="large">
<Button type="ghost"></Button>
<Button type="ghost"></Button>
<Button type="ghost"></Button>
</ButtonGroup>
<ButtonGroup>
<Button type="ghost">默认</Button>
<Button type="ghost">默认</Button>
<Button type="ghost">默认</Button>
</ButtonGroup>
<ButtonGroup size="small">
<Button type="ghost"></Button>
<Button type="ghost"></Button>
<Button type="ghost"></Button>
</ButtonGroup>
</div>, mountNode);
````
<style>

View File

@ -40,13 +40,13 @@ export default class Header extends React.Component {
return (
<Select
style={{ width: 75 }}
size={ fullscreen ? null : 'small' }
size={fullscreen ? null : 'small'}
dropdownMatchSelectWidth={false}
dropdownMenuStyle={{ minWidth: 103 }}
className={`${prefixCls}-year-select`}
onChange={this.onYearChange}
value={String(year)}>
{ options }
{options}
</Select>
);
}
@ -65,12 +65,12 @@ export default class Header extends React.Component {
<Select
style={{ minWidth: 70 }}
dropdownMenuStyle={{ minWidth: 125 }}
size={ fullscreen ? null : 'small' }
size={fullscreen ? null : 'small'}
dropdownMatchSelectWidth={false}
className={`${prefixCls}-month-select`}
value={String(month)}
onChange={this.onMonthChange}>
{ options }
{options}
</Select>
);
}
@ -104,9 +104,9 @@ export default class Header extends React.Component {
return (
<div className={`${prefixCls}-header`}>
{ yearSelect }
{ monthSelect }
{ typeSwitch }
{yearSelect}
{monthSelect}
{typeSwitch}
</div>
);
}

View File

@ -31,12 +31,12 @@ const optionsWithDisabled = [
];
ReactDOM.render(
<div>
<CheckboxGroup options={plainOptions} defaultValue={['Apple']} onChange={onChange} />
<br />
<CheckboxGroup options={options} defaultValue={['Pear']} onChange={onChange} />
<br />
<CheckboxGroup options={optionsWithDisabled} disabled defaultValue={['Apple']} onChange={onChange} />
</div>
<div>
<CheckboxGroup options={plainOptions} defaultValue={['Apple']} onChange={onChange} />
<br />
<CheckboxGroup options={options} defaultValue={['Pear']} onChange={onChange} />
<br />
<CheckboxGroup options={optionsWithDisabled} disabled defaultValue={['Apple']} onChange={onChange} />
</div>
, mountNode);
````

View File

@ -13,6 +13,6 @@ function onChange(value) {
}
ReactDOM.render(
<DatePicker showTime format="yyyy-MM-dd HH:mm:ss" placeholder="请选择时间" onChange={onChange} />
<DatePicker showTime format="yyyy-MM-dd HH:mm:ss" placeholder="请选择时间" onChange={onChange} />
, mountNode);
````

View File

@ -28,7 +28,7 @@ export default class FormItem extends React.Component {
form: React.PropTypes.object,
}
_getLayoutClass(colDef) {
getLayoutClass(colDef) {
if (!colDef) {
return '';
}
@ -132,7 +132,7 @@ export default class FormItem extends React.Component {
renderWrapper(children) {
const wrapperCol = this.props.wrapperCol;
return (
<div className={this._getLayoutClass(wrapperCol)} key="wrapper">
<div className={this.getLayoutClass(wrapperCol)} key="wrapper">
{children}
</div>
);
@ -158,7 +158,7 @@ export default class FormItem extends React.Component {
props.required;
const className = classNames({
[this._getLayoutClass(labelCol)]: true,
[this.getLayoutClass(labelCol)]: true,
[`${props.prefixCls}-item-required`]: required,
});

View File

@ -12,76 +12,76 @@ import { Form, Input, Row, Col, Button, DatePicker } from 'antd';
const FormItem = Form.Item;
ReactDOM.render(
<Form horizontal className="ant-advanced-search-form">
<Row gutter={16}>
<Col sm={8}>
<FormItem
label="搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" />
</FormItem>
<FormItem
label="较长搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<DatePicker size="default" />
</FormItem>
<FormItem
label="搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" />
</FormItem>
</Col>
<Col sm={8}>
<FormItem
label="搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" />
</FormItem>
<FormItem
label="较长搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<DatePicker size="default" />
</FormItem>
<FormItem
label="搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" />
</FormItem>
</Col>
<Col sm={8}>
<FormItem
label="搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" />
</FormItem>
<FormItem
label="较长搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<DatePicker size="default" />
</FormItem>
<FormItem
label="搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" />
</FormItem>
</Col>
</Row>
<Row>
<Col span={12} offset={12} style={{ textAlign: 'right' }}>
<Button type="primary" htmlType="submit">搜索</Button>
<Button>清除条件</Button>
</Col>
</Row>
</Form>
<Form horizontal className="ant-advanced-search-form">
<Row gutter={16}>
<Col sm={8}>
<FormItem
label="搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" />
</FormItem>
<FormItem
label="较长搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<DatePicker size="default" />
</FormItem>
<FormItem
label="搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" />
</FormItem>
</Col>
<Col sm={8}>
<FormItem
label="搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" />
</FormItem>
<FormItem
label="较长搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<DatePicker size="default" />
</FormItem>
<FormItem
label="搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" />
</FormItem>
</Col>
<Col sm={8}>
<FormItem
label="搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" />
</FormItem>
<FormItem
label="较长搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<DatePicker size="default" />
</FormItem>
<FormItem
label="搜索名称:"
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}>
<Input placeholder="请输入搜索名称" />
</FormItem>
</Col>
</Row>
<Row>
<Col span={12} offset={12} style={{ textAlign: 'right' }}>
<Button type="primary" htmlType="submit">搜索</Button>
<Button>清除条件</Button>
</Col>
</Row>
</Form>
, mountNode);
````

View File

@ -59,7 +59,7 @@ let Demo = React.createClass({
});
return (
<Form horizontal form={this.props.form}>
{ formItems }
{formItems}
<Form.Item wrapperCol={{ span: 18, offset: 6 }}>
<Button onClick={this.add}>新增好朋友</Button>
&nbsp;

View File

@ -13,6 +13,6 @@ function onChange(value) {
}
ReactDOM.render(
<InputNumber min={1} max={10} defaultValue={3} onChange={onChange} />
<InputNumber min={1} max={10} defaultValue={3} onChange={onChange} />
, mountNode);
````

View File

@ -13,6 +13,6 @@ function onChange(value) {
}
ReactDOM.render(
<InputNumber min={1} max={10} step={0.1} onChange={onChange} />
<InputNumber min={1} max={10} step={0.1} onChange={onChange} />
, mountNode);
````

View File

@ -13,16 +13,16 @@ function onChange(value) {
}
ReactDOM.render(
<div>
<InputNumber size="large" min={1} max={100000} defaultValue={3} onChange={onChange} />
<InputNumber min={1} max={100000} defaultValue={3} onChange={onChange} />
<InputNumber size="small" min={1} max={100000} defaultValue={3} onChange={onChange} />
</div>
<div>
<InputNumber size="large" min={1} max={100000} defaultValue={3} onChange={onChange} />
<InputNumber min={1} max={100000} defaultValue={3} onChange={onChange} />
<InputNumber size="small" min={1} max={100000} defaultValue={3} onChange={onChange} />
</div>
, mountNode);
````
````css
.ant-input-number{
.ant-input-number {
margin-right: 10px;
}
````

View File

@ -68,12 +68,12 @@ const Page = React.createClass({
</Popconfirm>
</div>
<div className="example">
<Transfer
dataSource={[]}
showSearch
titles={['', '']}
targetKeys={[]}
render={item => item.title} />
<Transfer
dataSource={[]}
showSearch
titles={['', '']}
targetKeys={[]}
render={item => item.title} />
</div>
<div style={{ width: 290, border: '1px solid #d9d9d9', borderRadius: 4 }}>
<Calendar fullscreen={false} />

View File

@ -1,8 +1,13 @@
import Pagination from 'rc-pagination/lib/locale/en_US';
import DatePicker from '../date-picker/locale/en_US';
import TimePicker from '../time-picker/locale/en_US';
import Calendar from '../calendar/locale/en_US';
export default {
Pagination: require('rc-pagination/lib/locale/en_US'),
DatePicker: require('../date-picker/locale/en_US'),
TimePicker: require('../time-picker/locale/en_US'),
Calendar: require('../calendar/locale/en_US'),
Pagination,
DatePicker,
TimePicker,
Calendar,
Table: {
filterTitle: 'Filter Menu',
filterConfirm: 'OK',

View File

@ -2,11 +2,16 @@
* Created by Andrey Gayvoronsky on 13/04/16.
*/
import Pagination from 'rc-pagination/lib/locale/ru_RU';
import DatePicker from '../date-picker/locale/ru_RU';
import TimePicker from '../time-picker/locale/ru_RU';
import Calendar from '../calendar/locale/ru_RU';
export default {
Pagination: require('rc-pagination/lib/locale/ru_RU'),
DatePicker: require('../date-picker/locale/ru_RU'),
TimePicker: require('../time-picker/locale/ru_RU'),
Calendar: require('../calendar/locale/ru_RU'),
Pagination,
DatePicker,
TimePicker,
Calendar,
Table: {
filterTitle: 'Фильтр',
filterConfirm: 'OK',
@ -29,4 +34,3 @@ export default {
itemsUnit: 'items',
},
};

View File

@ -23,7 +23,8 @@ function showConfirm() {
}
ReactDOM.render(
<Button onClick={showConfirm}>
确认对话框
</Button>, mountNode);
<Button onClick={showConfirm}>
确认对话框
</Button>
, mountNode);
````

View File

@ -21,7 +21,8 @@ function showConfirm() {
}
ReactDOM.render(
<Button onClick={showConfirm}>
确认对话框
</Button>, mountNode);
<Button onClick={showConfirm}>
确认对话框
</Button>
, mountNode);
````

View File

@ -8,7 +8,7 @@ title: 受控
````jsx
import { Pagination } from 'antd';
let Container = React.createClass({
const Container = React.createClass({
getInitialState() {
return {
current: 3
@ -25,8 +25,5 @@ let Container = React.createClass({
}
});
ReactDOM.render(
<Container />,
mountNode);
ReactDOM.render(<Container />, mountNode);
````

View File

@ -10,10 +10,10 @@ import { Popover, Button } from 'antd';
const text = <span>标题</span>;
const content = (
<div>
<p>内容</p>
<p>内容</p>
</div>
<div>
<p>内容</p>
<p>内容</p>
</div>
);
ReactDOM.render(

View File

@ -10,10 +10,10 @@ import { Progress } from 'antd';
ReactDOM.render(
<div>
<Progress type="circle" percent={75} format={percent => `${percent / 10.0}折` } />
<Progress type="circle" percent={75} format={percent => `${percent / 10.0}折`} />
<Progress type="circle" percent={100} format={() => '成功'} />
</div>
, mountNode);
, mountNode);
````
<style>

View File

@ -49,14 +49,14 @@ const Test = React.createClass({
<Button onClick={this.onRemove} style={{ marginLeft: 10 }}>删除</Button>
</p>
<div className="demo-content">
<div className="demo-listBox" key="b">
<div className="demo-list">
<div className="title"></div>
<QueueAnim component="ul" type={['right', 'left']}>
{this.state.show ? this.state.items : null}
</QueueAnim>
</div>
<div className="demo-listBox" key="b">
<div className="demo-list">
<div className="title"></div>
<QueueAnim component="ul" type={['right', 'left']}>
{this.state.show ? this.state.items : null}
</QueueAnim>
</div>
</div>
</div>
</div>
);

View File

@ -30,7 +30,7 @@ const Test = React.createClass({
</div>,
<div className="demo-listBox" key="b">
<div className="demo-list">
<div className="title"></div>
<div className="title"></div>
<ul>
<li></li>
<li></li>

View File

@ -13,10 +13,10 @@ function log(value) {
}
ReactDOM.render(
<div>
<Slider defaultValue={30} onChange={log} />
<Slider range step={10} defaultValue={[20, 50]} onChange={log} />
<Slider defaultValue={30} onAfterChange={log} />
</div>
<div>
<Slider defaultValue={30} onChange={log} />
<Slider range step={10} defaultValue={[20, 50]} onChange={log} />
<Slider defaultValue={30} onAfterChange={log} />
</div>
, mountNode);
````

View File

@ -41,7 +41,7 @@ const IconSlider = React.createClass({
});
ReactDOM.render(
<IconSlider min={0} max={20} value={0} icon={['frown', 'smile']} />
<IconSlider min={0} max={20} value={0} icon={['frown', 'smile']} />
, mountNode);
````

View File

@ -21,16 +21,16 @@ const marks = {
};
ReactDOM.render(
<div>
<p>包含关系</p>
<Slider marks={marks} defaultValue={37} />
<Slider range marks={marks} defaultValue={[26, 37]} />
<p>并列关系</p>
<Slider marks={marks} included={false} defaultValue={37} />
<p>结合 step</p>
<Slider marks={marks} step={10} defaultValue={37} />
<p>`step=null`</p>
<Slider marks={marks} step={null} defaultValue={37} />
</div>
<div>
<p>包含关系</p>
<Slider marks={marks} defaultValue={37} />
<Slider range marks={marks} defaultValue={[26, 37]} />
<p>并列关系</p>
<Slider marks={marks} included={false} defaultValue={37} />
<p>结合 step</p>
<Slider marks={marks} step={10} defaultValue={37} />
<p>`step=null`</p>
<Slider marks={marks} step={null} defaultValue={37} />
</div>
, mountNode);
````

View File

@ -22,9 +22,9 @@ const data = [
];
ReactDOM.render(
<Table columns={columns}
expandedRowRender={record => <p>{record.description}</p>}
dataSource={data}
className="table" />
<Table columns={columns}
expandedRowRender={record => <p>{record.description}</p>}
dataSource={data}
className="table" />
, mountNode);
````

View File

@ -60,9 +60,9 @@ const App = React.createClass({
return (
<div>
<div style={{ marginBottom: 16 }}>
<Button type="primary" onClick={this.start}
disabled={!hasSelected} loading={loading}>操作</Button>
<span style={{ marginLeft: 8 }}>{hasSelected ? `选择了 ${selectedRowKeys.length} 个对象` : ''}</span>
<Button type="primary" onClick={this.start}
disabled={!hasSelected} loading={loading}>操作</Button>
<span style={{ marginLeft: 8 }}>{hasSelected ? `选择了 ${selectedRowKeys.length} 个对象` : ''}</span>
</div>
<Table rowSelection={rowSelection} columns={columns} dataSource={data} />
</div>

View File

@ -215,7 +215,7 @@ export default class Table extends React.Component {
if (result !== 0) {
return (sortOrder === 'descend') ? -result : result;
}
return a._index - b._index;
return a.indexForSort - b.indexForSort;
};
}
@ -475,9 +475,9 @@ export default class Table extends React.Component {
this.props.rowSelection.getCheckboxProps &&
this.props.rowSelection.getCheckboxProps(item).disabled);
const checkboxAll = (
<Checkbox checked={checked}
disabled={checkboxAllDisabled}
onChange={this.handleSelectAllRow} />
<Checkbox checked={checked}
disabled={checkboxAllDisabled}
onChange={this.handleSelectAllRow} />
);
selectionColumn = {
key: 'selection-column',
@ -644,7 +644,7 @@ export default class Table extends React.Component {
//
data = data.slice(0);
for (let i = 0; i < data.length; i++) {
data[i]._index = i;
data[i].indexForSort = i;
}
const sorterFn = this.getSorterFn();
if (sorterFn) {

View File

@ -10,13 +10,14 @@ import { Tabs } from 'antd';
const TabPane = Tabs.TabPane;
ReactDOM.render(
<div className="card-container">
<Tabs type="card">
<TabPane tab="选项卡一" key="1">选项卡一内容</TabPane>
<TabPane tab="选项卡二" key="2">选项卡二内容</TabPane>
<TabPane tab="选项卡三" key="3">选项卡三内容</TabPane>
</Tabs>
</div>, mountNode);
<div className="card-container">
<Tabs type="card">
<TabPane tab="选项卡一" key="1">选项卡一内容</TabPane>
<TabPane tab="选项卡二" key="2">选项卡二内容</TabPane>
<TabPane tab="选项卡三" key="3">选项卡三内容</TabPane>
</Tabs>
</div>
, mountNode);
````
````css

View File

@ -12,9 +12,10 @@ const TabPane = Tabs.TabPane;
const operations = <Button>额外操作</Button>;
ReactDOM.render(
<Tabs tabBarExtraContent={operations}>
<TabPane tab="选项卡一" key="1">选项卡一内容</TabPane>
<TabPane tab="选项卡二" key="2">选项卡二内容</TabPane>
<TabPane tab="选项卡三" key="3">选项卡三内容</TabPane>
</Tabs>, mountNode);
<Tabs tabBarExtraContent={operations}>
<TabPane tab="选项卡一" key="1">选项卡一内容</TabPane>
<TabPane tab="选项卡二" key="2">选项卡二内容</TabPane>
<TabPane tab="选项卡三" key="3">选项卡三内容</TabPane>
</Tabs>
, mountNode);
````

View File

@ -9,11 +9,11 @@ title: 基本用法
import { Timeline } from 'antd';
ReactDOM.render(
<Timeline>
<Timeline.Item>创建服务现场 2015-09-01</Timeline.Item>
<Timeline.Item>初步排除网络异常 2015-09-01</Timeline.Item>
<Timeline.Item>技术测试异常 2015-09-01</Timeline.Item>
<Timeline.Item>网络异常正在修复 2015-09-01</Timeline.Item>
</Timeline>
<Timeline>
<Timeline.Item>创建服务现场 2015-09-01</Timeline.Item>
<Timeline.Item>初步排除网络异常 2015-09-01</Timeline.Item>
<Timeline.Item>技术测试异常 2015-09-01</Timeline.Item>
<Timeline.Item>网络异常正在修复 2015-09-01</Timeline.Item>
</Timeline>
, mountNode);
````

View File

@ -9,19 +9,19 @@ title: 圆圈颜色
import { Timeline } from 'antd';
ReactDOM.render(
<Timeline>
<Timeline.Item color="green">创建服务现场 2015-09-01</Timeline.Item>
<Timeline.Item color="green">创建服务现场 2015-09-01</Timeline.Item>
<Timeline.Item color="red">
<p>初步排除网络异常1</p>
<p>初步排除网络异常2</p>
<p>初步排除网络异常3 2015-09-01</p>
</Timeline.Item>
<Timeline.Item>
<p>技术测试异常1</p>
<p>技术测试异常2</p>
<p>技术测试异常3 2015-09-01</p>
</Timeline.Item>
</Timeline>
<Timeline>
<Timeline.Item color="green">创建服务现场 2015-09-01</Timeline.Item>
<Timeline.Item color="green">创建服务现场 2015-09-01</Timeline.Item>
<Timeline.Item color="red">
<p>初步排除网络异常1</p>
<p>初步排除网络异常2</p>
<p>初步排除网络异常3 2015-09-01</p>
</Timeline.Item>
<Timeline.Item>
<p>技术测试异常1</p>
<p>技术测试异常2</p>
<p>技术测试异常3 2015-09-01</p>
</Timeline.Item>
</Timeline>
, mountNode);
````

View File

@ -9,10 +9,10 @@ title: 最后一个
import { Timeline } from 'antd';
ReactDOM.render(
<Timeline pending={<a href="#">查看更多</a>}>
<Timeline.Item>创建服务现场 2015-09-01</Timeline.Item>
<Timeline.Item>初步排除网络异常 2015-09-01</Timeline.Item>
<Timeline.Item>技术测试异常 2015-09-01</Timeline.Item>
</Timeline>
<Timeline pending={<a href="#">查看更多</a>}>
<Timeline.Item>创建服务现场 2015-09-01</Timeline.Item>
<Timeline.Item>初步排除网络异常 2015-09-01</Timeline.Item>
<Timeline.Item>技术测试异常 2015-09-01</Timeline.Item>
</Timeline>
, mountNode);
````

View File

@ -158,26 +158,26 @@ export default class TransferList extends React.Component {
</span>
</span>
</div>
{ bodyDom ||
<div className={ showSearch ? `${prefixCls}-body ${prefixCls}-body-with-search` : `${prefixCls}-body`}>
{ showSearch ? <div className={`${prefixCls}-body-search-wrapper`}>
<Search prefixCls={`${prefixCls}-search`}
onChange={this.handleFilter}
handleClear={this.handleClear}
placeholder={searchPlaceholder || '请输入搜索内容'}
value={filter} />
</div> : null }
<Animate component="ul"
transitionName={this.state.mounted ? `${prefixCls}-highlight` : ''}
transitionLeave={false}>
{showItems.length > 0
? showItems
: <div className={`${prefixCls}-body-not-found`}>{notFoundContent || '列表为空'}</div>}
</Animate>
</div>}
{ footerDom ? <div className={`${prefixCls}-footer`}>
{ footerDom }
</div> : null }
{bodyDom ||
<div className={showSearch ? `${prefixCls}-body ${prefixCls}-body-with-search` : `${prefixCls}-body`}>
{showSearch ? <div className={`${prefixCls}-body-search-wrapper`}>
<Search prefixCls={`${prefixCls}-search`}
onChange={this.handleFilter}
handleClear={this.handleClear}
placeholder={searchPlaceholder || '请输入搜索内容'}
value={filter} />
</div> : null}
<Animate component="ul"
transitionName={this.state.mounted ? `${prefixCls}-highlight` : ''}
transitionLeave={false}>
{showItems.length > 0
? showItems
: <div className={`${prefixCls}-body-not-found`}>{notFoundContent || '列表为空'}</div>}
</Animate>
</div>}
{footerDom ? <div className={`${prefixCls}-footer`}>
{footerDom}
</div> : null}
</div>
);
}

View File

@ -30,13 +30,13 @@ export default class Search extends React.Component {
const { placeholder, value, prefixCls } = this.props;
return (
<div>
<input placeholder={placeholder} className={ `${prefixCls} ant-input` } value={ value } ref="input"
<input placeholder={placeholder} className={`${prefixCls} ant-input`} value={value} ref="input"
onChange={this.handleChange} />
{ value && value.length > 0 ?
<a href="#" className={ `${prefixCls}-action` } onClick={this.handleClear}>
{value && value.length > 0 ?
<a href="#" className={`${prefixCls}-action`} onClick={this.handleClear}>
<Icon type="cross-circle" />
</a>
: <span className={ `${prefixCls}-action` }><Icon type="search" /></span>
: <span className={`${prefixCls}-action`}><Icon type="search" /></span>
}
</div>
);

View File

@ -29,10 +29,10 @@ const generateData = (_level, _preKey, _tns) => {
if (_level < 0) {
return tns;
}
const __level = _level - 1;
const level = _level - 1;
children.forEach((key, index) => {
tns[index].children = [];
return generateData(__level, key, tns[index].children);
return generateData(level, key, tns[index].children);
});
};
generateData(z);

View File

@ -29,10 +29,10 @@ const generateData = (_level, _preKey, _tns) => {
if (_level < 0) {
return tns;
}
const __level = _level - 1;
const level = _level - 1;
children.forEach((key, index) => {
tns[index].children = [];
return generateData(__level, key, tns[index].children);
return generateData(level, key, tns[index].children);
});
};
generateData(z);

View File

@ -16,21 +16,21 @@ const props = {
};
ReactDOM.render(
<div>
<div style={{ width: 246, height: 140 }}>
<Dragger {...props}>
<Icon type="plus" />
</Dragger>
<div>
<div style={{ width: 246, height: 140 }}>
<Dragger {...props}>
<Icon type="plus" />
</Dragger>
</div>
<div style={{ marginTop: 16, height: 180 }}>
<Dragger {...props}>
<p className="ant-upload-drag-icon">
<Icon type="inbox" />
</p>
<p className="ant-upload-text">点击或将文件拖拽到此区域上传</p>
<p className="ant-upload-hint">支持单个或批量上传,严禁上传公司内部资料及其他违禁文件</p>
</Dragger>
</div>
</div>
<div style={{ marginTop: 16, height: 180 }}>
<Dragger {...props}>
<p className="ant-upload-drag-icon">
<Icon type="inbox" />
</p>
<p className="ant-upload-text">点击或将文件拖拽到此区域上传</p>
<p className="ant-upload-hint">支持单个或批量上传,严禁上传公司内部资料及其他违禁文件</p>
</Dragger>
</div>
</div>
, mountNode);
````

View File

@ -29,20 +29,20 @@ const props = {
};
ReactDOM.render(
<div>
<Upload {...props}>
<Button type="ghost">
<Icon type="upload" /> 点击上传
</Button>
</Upload>
<br />
<br />
<Upload {...props} className="upload-list-inline">
<Button type="ghost">
<Icon type="upload" /> 点击上传
</Button>
</Upload>
</div>
<div>
<Upload {...props}>
<Button type="ghost">
<Icon type="upload" /> 点击上传
</Button>
</Upload>
<br />
<br />
<Upload {...props} className="upload-list-inline">
<Button type="ghost">
<Icon type="upload" /> 点击上传
</Button>
</Upload>
</div>
, mountNode);
````

View File

@ -137,7 +137,7 @@ export default class Upload extends React.Component {
if (typeof response === 'string') {
response = JSON.parse(response);
}
} catch (e) {/* do nothing */}
} catch (e) { /* do nothing */ }
let fileList = this.state.fileList;
let targetItem = getFileItem(file, fileList);
//

View File

@ -106,7 +106,7 @@ export default class UploadList extends React.Component {
) : <Icon type="cross" onClick={() => this.handleClose(file)} />
}
</div>
{ progress }
{progress}
</div>
);
});

View File

@ -73,19 +73,20 @@
"devDependencies": {
"antd-tools": "~0.3.0",
"babel-eslint": "^6.0.2",
"babel-jest": "^11.0.2",
"babel-jest": "^12.0.2",
"babel-plugin-antd": "^0.4.0",
"dom-scroll-into-view": "^1.1.0",
"es6-shim": "^0.35.0",
"eslint": "^2.2.0",
"eslint-config-airbnb": "^7.0.0",
"eslint-config-airbnb": "^8.0.0",
"eslint-plugin-babel": "^3.0.0",
"eslint-plugin-jsx-a11y": "^0.6.2",
"eslint-plugin-import": "^1.6.1",
"eslint-plugin-jsx-a11y": "^1.0.4",
"eslint-plugin-markdown": "*",
"eslint-plugin-react": "^5.0.1",
"eslint-tinker": "^0.3.1",
"history": "^2.0.1",
"jest-cli": "^11.0.0",
"jest-cli": "^12.0.2",
"jsonml-to-react-component": "~0.2.0",
"jsonml.js": "^0.1.0",
"jsonp": "^0.2.0",
@ -124,7 +125,7 @@
"eslint-fix": "eslint --fix components test site scripts ./*.js --ext '.js,.jsx' && eslint-tinker ./components/*/demo/*.md",
"test": "npm run lint && npm run dist && npm run jest",
"jest": "jest",
"pre-publish":"node ./scripts/prepub",
"pre-publish": "node ./scripts/prepub",
"pub": "antd-tools run pub",
"beta": "antd-tools run beta",
"authors": "git log --format='%aN <%aE>' | sort -u | grep -v 'users.noreply.github.com' | grep -v 'alibaba-inc.com' | grep -v 'alipay.com' | grep -v 'taobao.com' > AUTHORS.txt"

View File

@ -6,7 +6,7 @@ export default function App(props) {
return (
<div>
<Header {...props} />
{ props.children }
{props.children}
<Footer />
</div>
);

View File

@ -39,7 +39,7 @@ export default class Article extends React.Component {
return (
<li key={getChildren(node)[0]}>
<Link to={{ pathname: location.pathname, query: { scrollTo: getChildren(node)[0] } }}>
{ utils.jsonmlToComponent(location.pathname, getChildren(node)[0]) }
{utils.jsonmlToComponent(location.pathname, getChildren(node)[0])}
</Link>
</li>
);
@ -53,7 +53,7 @@ export default class Article extends React.Component {
{meta.english} {meta.chinese}
{
!meta.subtitle ? null :
<span className="subtitle">{ meta.subtitle }</span>
<span className="subtitle">{meta.subtitle}</span>
}
</h1>
{
@ -65,7 +65,7 @@ export default class Article extends React.Component {
}
{
(jumper.length > 0 && meta.toc !== false) ?
<section className="toc"><ul>{ jumper }</ul></section> :
<section className="toc"><ul>{jumper}</ul></section> :
null
}
{

View File

@ -65,9 +65,9 @@ export default class ComponentDoc extends React.Component {
const jumper = demos.map((demo) => {
return (
<li key={demo.id}>
<Link className={ demo.id === scrollTo ? 'current' : ''}
<Link className={demo.id === scrollTo ? 'current' : ''}
to={{ pathname: location.pathname, query: { scrollTo: `${demo.id}` } }}>
{ demo.meta.title }
{demo.meta.title}
</Link>
</li>
);
@ -77,7 +77,7 @@ export default class ComponentDoc extends React.Component {
<article>
<Affix className="toc-affix" offsetTop={16}>
<ul className="toc demos-anchor">
{ jumper }
{jumper}
</ul>
</Affix>
<section className="markdown">
@ -96,17 +96,17 @@ export default class ComponentDoc extends React.Component {
</h2>
</section>
<Row gutter={16}>
<Col span={ isSingleCol ? '24' : '12' }
className={ isSingleCol ?
<Col span={isSingleCol ? '24' : '12'}
className={isSingleCol ?
'code-boxes-col-1-1' :
'code-boxes-col-2-1'
}
>
{ leftChildren }
{leftChildren}
</Col>
{
isSingleCol ? null :
<Col className="code-boxes-col-2-1" span="12">{ rightChildren }</Col>
<Col className="code-boxes-col-2-1" span="12">{rightChildren}</Col>
}
</Row>
{

View File

@ -51,10 +51,10 @@ export default class Demo extends React.Component {
<section className="code-box-meta markdown">
<div className="code-box-title">
<Link to={{ pathname, query: { scrollTo: id } }}>
{ meta.title }
{meta.title}
</Link>
</div>
{ introChildren }
{introChildren}
<span className="collapse anticon anticon-circle-o-right"
onClick={this.handleCodeExapnd}
unselectable="none" />

View File

@ -15,7 +15,7 @@ export default class IconSet extends React.Component {
[className]: !!className,
});
return (
<ul className={listClassName}>
<ul className={listClassName}>
{this.props.icons.map((type, i) => <CopyableIcon key={i} type={type} />)}
</ul>
);

View File

@ -26,7 +26,7 @@ function PreviewImageBox({ cover, coverMeta, imgs, style, previewVisible,
<Modal className="image-modal" width={960} visible={previewVisible} title={null} footer={null}
onCancel={onCancel}>
<Carousel className={`${onlyOneImg ? 'image-modal-single' : ''}`} adaptiveHeight>
{ comparable ? cover : imgs }
{comparable ? cover : imgs}
</Carousel>
<div className="preview-image-title">{coverMeta.alt}</div>
</Modal>

View File

@ -45,23 +45,23 @@ export default class MainContent extends React.Component {
generateMenuItem(isTop, item) {
const key = this.fileNameToPath(item.fileName);
const text = isTop ?
item.chinese || item.english : [
<span key="english">{ item.english }</span>,
<span className="chinese" key="chinese">{ item.chinese }</span>
];
item.chinese || item.english : [
<span key="english">{item.english}</span>,
<span className="chinese" key="chinese">{item.chinese}</span>
];
const disabled = item.disabled;
const url = item.fileName.replace(/(\/index)?\.md$/i, '');
const child = !item.link ?
<Link to={url} disabled={disabled}>
{ text }
</Link> :
<a href={item.link} target="_blank" disabled={disabled}>
{ text }
</a>;
<Link to={url} disabled={disabled}>
{text}
</Link> :
<a href={item.link} target="_blank" disabled={disabled}>
{text}
</a>;
return (
<Menu.Item key={key} disabled={disabled}>
{ child }
{child}
</Menu.Item>
);
}
@ -73,20 +73,20 @@ export default class MainContent extends React.Component {
generateSubMenuItems(obj) {
const topLevel = (obj.topLevel || []).map(this.generateMenuItem.bind(this, true));
const itemGroups = Object.keys(obj).filter(this.isNotTopLevel)
.sort((a, b) => {
return config.typeOrder[a] - config.typeOrder[b];
})
.map((type, index) => {
const groupItems = obj[type].sort((a, b) => {
return a.english.charCodeAt(0) - b.english.charCodeAt(0);
}).map(this.generateMenuItem.bind(this, false));
.sort((a, b) => {
return config.typeOrder[a] - config.typeOrder[b];
})
.map((type, index) => {
const groupItems = obj[type].sort((a, b) => {
return a.english.charCodeAt(0) - b.english.charCodeAt(0);
}).map(this.generateMenuItem.bind(this, false));
return (
<Menu.ItemGroup title={type} key={index}>
{ groupItems }
</Menu.ItemGroup>
);
});
return (
<Menu.ItemGroup title={type} key={index}>
{groupItems}
</Menu.ItemGroup>
);
});
return [...topLevel, ...itemGroups];
}
@ -103,7 +103,7 @@ export default class MainContent extends React.Component {
return (
<SubMenu title={<h4>{category}</h4>} key={category}>
{ subMenuItems }
{subMenuItems}
</SubMenu>
);
});
@ -148,11 +148,11 @@ export default class MainContent extends React.Component {
<Menu className="aside-container" mode="inline"
defaultOpenKeys={Object.keys(this.props.menuItems)}
selectedKeys={[activeMenuItem]}>
{ menuItems }
{menuItems}
</Menu>
</Col>
<Col lg={20} md={18} sm={24} xs={24} className="main-container">
{ this.props.children }
{this.props.children}
</Col>
</Row>

View File

@ -25,7 +25,7 @@ export function jsonmlToComponent(pathname, jsonml) {
id: children,
...getAttributes(node),
}, [
<span key="title">{ children.map((child) => toReactComponent(child)) }</span>,
<span key="title">{children.map((child) => toReactComponent(child))}</span>,
<Link to={{ pathname, query: { scrollTo: children } }} className="anchor" key="anchor">#</Link>,
]);
}],

View File

@ -50,28 +50,28 @@ ReactDOM.render(
<Route path="/" component={App}>
<IndexRoute component={Home} />
<Route path="components" component={ReactComponents}>
{ utils.generateIndex(reactComponents) }
{utils.generateIndex(reactComponents)}
<Route path=":children"
component={utils.getChildrenWrapper(reactComponents)} />
</Route>
{ redirects }
{redirects}
<Route path="docs/practice" component={Practice}>
{ utils.generateIndex(practice) }
{utils.generateIndex(practice)}
<Route path=":children"
component={utils.getChildrenWrapper(practice)} />
</Route>
<Route path="docs/pattern" component={Pattern}>
{ utils.generateIndex(pattern) }
{utils.generateIndex(pattern)}
<Route path=":children"
component={utils.getChildrenWrapper(pattern)} />
</Route>
<Route path="docs/spec" component={Spec}>
{ utils.generateIndex(spec) }
{utils.generateIndex(spec)}
<Route path=":children"
component={utils.getChildrenWrapper(spec)} />
</Route>
<Route path="docs/resource" component={Resource}>
{ utils.generateIndex(resource) }
{utils.generateIndex(resource)}
<Route path=":children"
component={utils.getChildrenWrapper(resource)} />
</Route>