home/ant-design
2
0
Fork 0
mirror of https://github.com/wahyd4/ant-design.git synced 2026-08-17 00:36:17 +10:00
Code Issues Packages Projects Releases Wiki Activity
Files
6491d33e9165802bfea1f9765c4454e533cd2d98
ant-design/docs/react/introduce.html
T
乐仪 6491d33e91 Updates
2017-05-31 19:19:37 +08:00

147 lines
52 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="An enterprise-class UI design language and React-based implementation">
<meta name="description" content="A set of high-quality React components">
<meta name="description" content="One of best React UI library for enterprise background">
<title>Ant Design - A UI Design Language</title>
<script>
(function() {
function isLocalStorageNameSupported() {
var testKey = 'test';
var storage = window.localStorage;
try {
storage.setItem(testKey, '1');
storage.removeItem(testKey);
return true;
} catch (error) {
return false;
}
}
// 优先级提高到所有静态资源的前面，语言不对，加载其他静态资源没意义
var pathname = location.pathname;
function isZhCN(pathname) {
return /-cn\/?$/.test(pathname);
}
function getLocalizedPathname(path, zhCN) {
var pathname = path.startsWith('/') ? path : '/' + path;
if (!zhCN) { // to enUS
return /\/?index-cn/.test(pathname) ? '/' : pathname.replace('-cn', '');
} else if (pathname === '/') {
return '/index-cn';
} else if (pathname.endsWith('/')) {
return pathname.replace(/\/$/, '-cn/');
}
return pathname + '-cn';
}
// 兼容旧的 URL， `?locale=...`
var queryString = location.search;
if (queryString) {
var isZhCNConfig = queryString.indexOf('zh-CN') > -1;
if (isZhCNConfig && !isZhCN(pathname)) {
location.pathname = getLocalizedPathname(pathname, isZhCNConfig)
}
}
// 首页无视链接里面的语言设置 https://github.com/ant-design/ant-design/issues/4552
if (isLocalStorageNameSupported() && (pathname === '/' || pathname === '/index-cn')) {
var lang = (window.localStorage && localStorage.getItem('locale')) || (navigator.language.toLowerCase() === 'zh-cn' ? 'zh-CN' : 'en-US');
// safari is 'zh-cn', while other browser is 'zh-CN';
if ((lang === 'zh-CN') !== isZhCN(pathname)) {
location.pathname = getLocalizedPathname(pathname, lang === 'zh-CN');
}
}
document.documentElement.className += isZhCN(pathname) ? 'zh-cn' : 'en-us';
})()
</script>
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.cnpmjs.org/css?family=Lato:400,700|Raleway"/>
<link rel="stylesheet" type="text/css" href="/index-1.css"/>
<link rel="stylesheet" type="text/css" href="/index-2.css"/>
<style id="nprogress-style">
#nprogress { display: none }
</style>
<!--[if lte IE 10]>
<script
src="https://as.alipayobjects.com/g/component/??console-polyfill/0.2.2/index.js,media-match/2.0.2/media.match.min.js"></script>
<![endif]-->
<script>
if (!window.Intl) {
document.writeln('<script src="https://as.alipayobjects.com/g/component/intl/1.0.1/??Intl.js,locale-data/jsonp/en.js,locale-data/jsonp/zh.js">' + '<' + '/script>');
}
if (!window.Promise) {
document.writeln('<script src="https://as.alipayobjects.com/g/component/es6-promise/3.2.2/es6-promise.min.js"' + '>' + '<' + '/' + 'script>');
}
// Enable Google Analytics
if (!location.port) {
/* eslint-disable */
(function (i, s, o, g, r, a, m) {
i['GoogleAnalyticsObject'] = r;
i[r] = i[r] || function () {
(i[r].q = i[r].q || []).push(arguments)
}, i[r].l = 1 * new Date();
a = s.createElement(o),
m = s.getElementsByTagName(o)[0];
a.async = 1;
a.src = g;
m.parentNode.insertBefore(a, m)
})(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
ga('create', 'UA-72788897-1', 'auto');
ga('send', 'pageview');
/* eslint-enable */
}
</script>
<!-- Hotjar Tracking Code for ant.design -->
<script>
(function(h,o,t,j,a,r){
h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
h._hjSettings={hjid:473408,hjsv:5};
a=o.getElementsByTagName('head')[0];
r=o.createElement('script');r.async=1;
r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
a.appendChild(r);
})(window,document,'//static.hotjar.com/c/hotjar-','.js?sv=');
</script>
</head>
<body>
<div id="react-content">
<div class="page-wrapper" data-reactroot="" data-reactid="1" data-react-checksum="-320132234"><header id="header" class="clearfix" data-reactid="2"><div class="ant-row" data-reactid="3"><div class="ant-col-xs-24 ant-col-sm-24 ant-col-md-5 ant-col-lg-4" data-reactid="4"><a id="logo" href="/" data-reactid="5"><img alt="logo" src="https://t.alipayobjects.com/images/rmsweb/T1B9hfXcdvXXXXXXXX.svg" data-reactid="6"/><span data-reactid="7">Ant Design</span></a></div><div class="ant-col-xs-0 ant-col-sm-0 ant-col-md-19 ant-col-lg-20" data-reactid="8"><div id="search-box" data-reactid="9"><div class="ant-select ant-select-combobox ant-select-enabled" data-reactid="10"><div class="ant-select-selection
ant-select-selection--single" role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-expanded="false" data-reactid="11"><div class="ant-select-selection__rendered" data-reactid="12"><div style="display:block;user-select:none;-webkit-user-select:none;" unselectable="unselectable" class="ant-select-selection__placeholder" data-reactid="13">Search Components...</div><ul data-reactid="14"><li class="ant-select-search ant-select-search--inline" data-reactid="15"><div class="ant-select-search__field__wrap" data-reactid="16"><input value="" class="ant-select-search__field" data-reactid="17"/><span class="ant-select-search__field__mirror" data-reactid="18"><!-- react-text: 19 --><!-- /react-text --><!-- react-text: 20 --> <!-- /react-text --></span></div></li></ul></div><span class="ant-select-arrow" style="user-select:none;-webkit-user-select:none;" unselectable="unselectable" data-reactid="21"><b data-reactid="22"></b></span></div></div></div><button type="button" class="ant-btn ant-btn-ghost ant-btn-sm lang" data-reactid="23"><span data-reactid="24">中文</span></button><div class="ant-select-sm version ant-select ant-select-enabled" data-reactid="25"><div class="ant-select-selection
ant-select-selection--single" role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-expanded="false" tabindex="0" data-reactid="26"><div class="ant-select-selection__rendered" data-reactid="27"><div class="ant-select-selection-selected-value" title="2.10.3" style="display:block;opacity:1;" data-reactid="28">2.10.3</div></div><span class="ant-select-arrow" style="user-select:none;-webkit-user-select:none;" unselectable="unselectable" data-reactid="29"><b data-reactid="30"></b></span></div></div><ul class="ant-menu ant-menu-horizontal ant-menu-light ant-menu-root" role="menu" aria-activedescendant="" id="nav" tabindex="0" data-reactid="31"><li class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="32"><a href="/" data-reactid="33"><span data-reactid="34">Home</span></a></li><li class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="35"><a href="/docs/spec/introduce" data-reactid="36"><span data-reactid="37">Guidelines</span></a></li><li class="ant-menu-item-selected ant-menu-item" role="menuitem" aria-selected="true" data-reactid="38"><a href="/docs/react/introduce" data-reactid="39"><span data-reactid="40">Components</span></a></li><li class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="41"><a href="/docs/pattern/navigation" data-reactid="42"><span data-reactid="43">Patterns</span></a></li><li class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="44"><a href="/docs/resource/download" data-reactid="45"><span data-reactid="46">Resources</span></a></li></ul></div></div></header><div class="main-wrapper" data-reactid="47"><div class="ant-row" data-reactid="48"><div class="ant-col-xs-24 ant-col-sm-24 ant-col-md-6 ant-col-lg-4" data-reactid="49"><ul class="ant-menu ant-menu-inline aside-container ant-menu-light ant-menu-root" role="menu" aria-activedescendant="" tabindex="0" data-reactid="50"><li style="padding-left:24px;" class="ant-menu-item-selected ant-menu-item" role="menuitem" aria-selected="true" data-reactid="51"><a href="/docs/react/introduce" data-reactid="52">Ant Design of React</a></li><li style="padding-left:24px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="53"><a href="/docs/react/getting-started" data-reactid="54">Getting Started</a></li><li style="padding-left:24px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="55"><a href="/docs/react/practical-projects" data-reactid="56">Real project with dva</a></li><li style="padding-left:24px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="57"><a href="/docs/react/use-with-create-react-app" data-reactid="58">Use in create-react-app</a></li><li style="padding-left:24px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="59"><a href="/docs/react/customize-theme" data-reactid="60">Customize Theme</a></li><li style="padding-left:24px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="61"><a href="/changelog" data-reactid="62">Change Log</a></li><li style="padding-left:24px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="63"><a href="/docs/react/recommendation" data-reactid="64">Third-Party Libraries</a></li><li style="padding-left:24px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="65"><a href="/docs/react/i18n" data-reactid="66">Internationalization</a></li><li class="ant-menu-submenu-inline ant-menu-submenu-open ant-menu-submenu" data-reactid="67"><div style="padding-left:24px;" class="ant-menu-submenu-title" aria-expanded="true" aria-owns="Components$Menu" aria-haspopup="true" data-reactid="68"><h4 data-reactid="69">Components</h4></div><ul class="ant-menu ant-menu-inline ant-menu-sub" role="menu" aria-activedescendant="" id="Components$Menu" data-reactid="70"><li class=" ant-menu-item-group" data-reactid="71"><div class="ant-menu-item-group-title" data-reactid="72">General</div><ul class="ant-menu-item-group-list" data-reactid="73"><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="74"><a href="/components/button/" data-reactid="75"><span data-reactid="76">Button</span><span class="chinese" data-reactid="77"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="78"><a href="/components/icon/" data-reactid="79"><span data-reactid="80">Icon</span><span class="chinese" data-reactid="81"></span></a></li></ul></li><li class=" ant-menu-item-group" data-reactid="82"><div class="ant-menu-item-group-title" data-reactid="83">Layout</div><ul class="ant-menu-item-group-list" data-reactid="84"><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="85"><a href="/components/grid/" data-reactid="86"><span data-reactid="87">Grid</span><span class="chinese" data-reactid="88"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="89"><a href="/components/layout/" data-reactid="90"><span data-reactid="91">Layout</span><span class="chinese" data-reactid="92"></span></a></li></ul></li><li class=" ant-menu-item-group" data-reactid="93"><div class="ant-menu-item-group-title" data-reactid="94">Navigation</div><ul class="ant-menu-item-group-list" data-reactid="95"><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="96"><a href="/components/affix/" data-reactid="97"><span data-reactid="98">Affix</span><span class="chinese" data-reactid="99"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="100"><a href="/components/breadcrumb/" data-reactid="101"><span data-reactid="102">Breadcrumb</span><span class="chinese" data-reactid="103"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="104"><a href="/components/back-top/" data-reactid="105"><span data-reactid="106">BackTop</span><span class="chinese" data-reactid="107"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="108"><a href="/components/dropdown/" data-reactid="109"><span data-reactid="110">Dropdown</span><span class="chinese" data-reactid="111"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="112"><a href="/components/menu/" data-reactid="113"><span data-reactid="114">Menu</span><span class="chinese" data-reactid="115"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="116"><a href="/components/pagination/" data-reactid="117"><span data-reactid="118">Pagination</span><span class="chinese" data-reactid="119"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="120"><a href="/components/steps/" data-reactid="121"><span data-reactid="122">Steps</span><span class="chinese" data-reactid="123"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="124"><a href="/components/tabs/" data-reactid="125"><span data-reactid="126">Tabs</span><span class="chinese" data-reactid="127"></span></a></li></ul></li><li class=" ant-menu-item-group" data-reactid="128"><div class="ant-menu-item-group-title" data-reactid="129">Data Entry</div><ul class="ant-menu-item-group-list" data-reactid="130"><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="131"><a href="/components/auto-complete/" data-reactid="132"><span data-reactid="133">AutoComplete</span><span class="chinese" data-reactid="134"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="135"><a href="/components/cascader/" data-reactid="136"><span data-reactid="137">Cascader</span><span class="chinese" data-reactid="138"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="139"><a href="/components/checkbox/" data-reactid="140"><span data-reactid="141">Checkbox</span><span class="chinese" data-reactid="142"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="143"><a href="/components/date-picker/" data-reactid="144"><span data-reactid="145">DatePicker</span><span class="chinese" data-reactid="146"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="147"><a href="/components/form/" data-reactid="148"><span data-reactid="149">Form</span><span class="chinese" data-reactid="150"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="151"><a href="/components/input-number/" data-reactid="152"><span data-reactid="153">InputNumber</span><span class="chinese" data-reactid="154"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="155"><a href="/components/input/" data-reactid="156"><span data-reactid="157">Input</span><span class="chinese" data-reactid="158"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="159"><a href="/components/mention/" data-reactid="160"><span data-reactid="161">Mention</span><span class="chinese" data-reactid="162"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="163"><a href="/components/rate/" data-reactid="164"><span data-reactid="165">Rate</span><span class="chinese" data-reactid="166"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="167"><a href="/components/radio/" data-reactid="168"><span data-reactid="169">Radio</span><span class="chinese" data-reactid="170"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="171"><a href="/components/select/" data-reactid="172"><span data-reactid="173">Select</span><span class="chinese" data-reactid="174"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="175"><a href="/components/slider/" data-reactid="176"><span data-reactid="177">Slider</span><span class="chinese" data-reactid="178"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="179"><a href="/components/switch/" data-reactid="180"><span data-reactid="181">Switch</span><span class="chinese" data-reactid="182"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="183"><a href="/components/tree-select/" data-reactid="184"><span data-reactid="185">TreeSelect</span><span class="chinese" data-reactid="186"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="187"><a href="/components/time-picker/" data-reactid="188"><span data-reactid="189">TimePicker</span><span class="chinese" data-reactid="190"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="191"><a href="/components/transfer/" data-reactid="192"><span data-reactid="193">Transfer</span><span class="chinese" data-reactid="194"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="195"><a href="/components/upload/" data-reactid="196"><span data-reactid="197">Upload</span><span class="chinese" data-reactid="198"></span></a></li></ul></li><li class=" ant-menu-item-group" data-reactid="199"><div class="ant-menu-item-group-title" data-reactid="200">Data Display</div><ul class="ant-menu-item-group-list" data-reactid="201"><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="202"><a href="/components/badge/" data-reactid="203"><span data-reactid="204">Badge</span><span class="chinese" data-reactid="205"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="206"><a href="/components/calendar/" data-reactid="207"><span data-reactid="208">Calendar</span><span class="chinese" data-reactid="209"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="210"><a href="/components/card/" data-reactid="211"><span data-reactid="212">Card</span><span class="chinese" data-reactid="213"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="214"><a href="/components/carousel/" data-reactid="215"><span data-reactid="216">Carousel</span><span class="chinese" data-reactid="217"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="218"><a href="/components/collapse/" data-reactid="219"><span data-reactid="220">Collapse</span><span class="chinese" data-reactid="221"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="222"><a href="/components/popover/" data-reactid="223"><span data-reactid="224">Popover</span><span class="chinese" data-reactid="225"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="226"><a href="/components/tooltip/" data-reactid="227"><span data-reactid="228">Tooltip</span><span class="chinese" data-reactid="229"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="230"><a href="/components/table/" data-reactid="231"><span data-reactid="232">Table</span><span class="chinese" data-reactid="233"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="234"><a href="/components/tag/" data-reactid="235"><span data-reactid="236">Tag</span><span class="chinese" data-reactid="237"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="238"><a href="/components/timeline/" data-reactid="239"><span data-reactid="240">Timeline</span><span class="chinese" data-reactid="241"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="242"><a href="/components/tree/" data-reactid="243"><span data-reactid="244">Tree</span><span class="chinese" data-reactid="245"></span></a></li></ul></li><li class=" ant-menu-item-group" data-reactid="246"><div class="ant-menu-item-group-title" data-reactid="247">Feedback</div><ul class="ant-menu-item-group-list" data-reactid="248"><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="249"><a href="/components/alert/" data-reactid="250"><span data-reactid="251">Alert</span><span class="chinese" data-reactid="252"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="253"><a href="/components/modal/" data-reactid="254"><span data-reactid="255">Modal</span><span class="chinese" data-reactid="256"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="257"><a href="/components/message/" data-reactid="258"><span data-reactid="259">Message</span><span class="chinese" data-reactid="260"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="261"><a href="/components/notification/" data-reactid="262"><span data-reactid="263">Notification</span><span class="chinese" data-reactid="264"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="265"><a href="/components/progress/" data-reactid="266"><span data-reactid="267">Progress</span><span class="chinese" data-reactid="268"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="269"><a href="/components/popconfirm/" data-reactid="270"><span data-reactid="271">Popconfirm</span><span class="chinese" data-reactid="272"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="273"><a href="/components/spin/" data-reactid="274"><span data-reactid="275">Spin</span><span class="chinese" data-reactid="276"></span></a></li></ul></li><li class=" ant-menu-item-group" data-reactid="277"><div class="ant-menu-item-group-title" data-reactid="278">Other</div><ul class="ant-menu-item-group-list" data-reactid="279"><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="280"><a href="/components/anchor/" data-reactid="281"><span data-reactid="282">Anchor</span><span class="chinese" data-reactid="283"></span></a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="284"><a href="/components/locale-provider/" data-reactid="285"><span data-reactid="286">LocaleProvider</span><span class="chinese" data-reactid="287"></span></a></li></ul></li></ul></li></ul></div><div class="main-container ant-col-xs-24 ant-col-sm-24 ant-col-md-18 ant-col-lg-20" data-reactid="288"><article class="markdown" data-reactid="289"><h1 data-reactid="290"><!-- react-text: 291 -->Ant Design of React<!-- /react-text --><a class="edit-button" href="https://github.com/ant-design/ant-design/edit/master/docs/react/introduce.en-US.md" data-reactid="292"><i class="anticon anticon-edit" data-reactid="293"></i></a></h1><section class="markdown" data-reactid="294"><p data-reactid="295"><!-- react-text: 296 -->Following the Ant Design specification, we developed a React UI library <!-- /react-text --><code data-reactid="297"><!-- react-text: 298 -->antd<!-- /react-text --></code><!-- react-text: 299 --> that contains a set of high quality components and demos for building rich, interactive user interfaces.<!-- /react-text --></p><div class="pic-plus" data-reactid="300"><img width="150" src="https://t.alipayobjects.com/images/rmsweb/T11aVgXc4eXXXXXXXX.svg" data-reactid="301"/><span data-reactid="302"><!-- react-text: 303 -->+<!-- /react-text --></span><img width="160" src="https://t.alipayobjects.com/images/rmsweb/T16xRhXkxbXXXXXXXX.svg" data-reactid="304"/></div><style data-reactid="305">
.pic-plus > * {
display: inline-block!important;
vertical-align: middle;
}
.pic-plus span {
font-size: 30px;
color: #aaa;
margin: 0 20px;
}
</style></section><section class="toc" data-reactid="306"><ul data-reactid="307"><li data-reactid="308"><a class="bisheng-toc-h2" href="#Features" title="Features" data-reactid="309"><!-- react-text: 310 -->Features<!-- /react-text --></a></li><li data-reactid="311"><a class="bisheng-toc-h2" href="#Environment-Support" title="Environment Support" data-reactid="312"><!-- react-text: 313 -->Environment Support<!-- /react-text --></a></li><li data-reactid="314"><a class="bisheng-toc-h2" href="#Version" title="Version" data-reactid="315"><!-- react-text: 316 -->Version<!-- /react-text --></a></li><li data-reactid="317"><a class="bisheng-toc-h2" href="#Installation" title="Installation" data-reactid="318"><!-- react-text: 319 -->Installation<!-- /react-text --></a></li><li data-reactid="320"><a class="bisheng-toc-h2" href="#Usage" title="Usage" data-reactid="321"><!-- react-text: 322 -->Usage<!-- /react-text --></a></li><li data-reactid="323"><a class="bisheng-toc-h2" href="#Links" title="Links" data-reactid="324"><!-- react-text: 325 -->Links<!-- /react-text --></a></li><li data-reactid="326"><a class="bisheng-toc-h2" href="#Companies-using-antd" title="Companies using antd" data-reactid="327"><!-- react-text: 328 -->Companies using antd<!-- /react-text --></a></li><li data-reactid="329"><a class="bisheng-toc-h2" href="#Contributing" title="Contributing" data-reactid="330"><!-- react-text: 331 -->Contributing<!-- /react-text --></a></li><li data-reactid="332"><a class="bisheng-toc-h2" href="#Need-Help?" title="Need Help?" data-reactid="333"><!-- react-text: 334 -->Need Help?<!-- /react-text --></a></li></ul></section><section class="markdown" data-reactid="335"><h2 id="Features" data-reactid="336"><span data-reactid="337"><!-- react-text: 338 -->Features<!-- /react-text --></span><a href="#Features" class="anchor" data-reactid="339">#</a></h2><ul data-reactid="340"><li data-reactid="341"><p data-reactid="342"><!-- react-text: 343 -->An enterprise-class UI design language for web applications.<!-- /react-text --></p></li><li data-reactid="344"><p data-reactid="345"><!-- react-text: 346 -->A set of high-quality React components out of the box.<!-- /react-text --></p></li><li data-reactid="347"><p data-reactid="348"><!-- react-text: 349 -->Written in TypeScript with complete defined types.<!-- /react-text --></p></li><li data-reactid="350"><p data-reactid="351"><!-- react-text: 352 -->A npm + webpack + <!-- /react-text --><a href="https://github.com/dvajs/dva" data-reactid="353"><!-- react-text: 354 -->dva<!-- /react-text --></a><!-- react-text: 355 --> front-end development workflow.<!-- /react-text --></p></li></ul><h2 id="Environment-Support" data-reactid="356"><span data-reactid="357"><!-- react-text: 358 -->Environment Support<!-- /react-text --></span><a href="#Environment-Support" class="anchor" data-reactid="359">#</a></h2><ul data-reactid="360"><li data-reactid="361"><p data-reactid="362"><!-- react-text: 363 -->Modern browsers and Internet Explorer 9+ (with <!-- /react-text --><a href="https://ant.design/docs/react/getting-started#Compatibility" data-reactid="364"><!-- react-text: 365 -->polyfills<!-- /react-text --></a><!-- react-text: 366 -->)<!-- /react-text --></p></li><li data-reactid="367"><p data-reactid="368"><!-- react-text: 369 -->Server-side Rendering<!-- /react-text --></p></li><li data-reactid="370"><p data-reactid="371"><a href="http://electron.atom.io/" data-reactid="372"><!-- react-text: 373 -->Electron<!-- /react-text --></a></p></li></ul><h2 id="Version" data-reactid="374"><span data-reactid="375"><!-- react-text: 376 -->Version<!-- /react-text --></span><a href="#Version" class="anchor" data-reactid="377">#</a></h2><ul data-reactid="378"><li data-reactid="379"><p data-reactid="380"><!-- react-text: 381 -->Stable: <!-- /react-text --><a href="https://www.npmjs.org/package/antd" data-reactid="382"><img src="https://img.shields.io/npm/v/antd.svg?style=flat-square" alt="npm package" data-reactid="383"/></a></p></li><li data-reactid="384"><p data-reactid="385"><!-- react-text: 386 -->Beta: <!-- /react-text --><a href="https://www.npmjs.org/package/antd" data-reactid="387"><img src="https://cnpmjs.org/badge/v/antd.svg?&amp;tag=beta&amp;subject=npm" data-reactid="388"/></a></p></li></ul><p data-reactid="389"><!-- react-text: 390 -->You can subscribe to this feed for new version notifications: <!-- /react-text --><a href="https://github.com/ant-design/ant-design/releases.atom" data-reactid="391"><!-- react-text: 392 -->https://github.com/ant-design/ant-design/releases.atom<!-- /react-text --></a></p><h2 id="Installation" data-reactid="393"><span data-reactid="394"><!-- react-text: 395 -->Installation<!-- /react-text --></span><a href="#Installation" class="anchor" data-reactid="396">#</a></h2><h3 id="Using-npm-or-yarn" data-reactid="397"><span data-reactid="398"><!-- react-text: 399 -->Using npm or yarn<!-- /react-text --></span><a href="#Using-npm-or-yarn" class="anchor" data-reactid="400">#</a></h3><p data-reactid="401"><strong data-reactid="402"><!-- react-text: 403 -->We recommend using npm or yarn to install<!-- /react-text --></strong><!-- react-text: 404 -->，it not only makes development easier，but also allow you to take advantage of the rich ecosystem of javascript packages and tooling.<!-- /react-text --></p><pre class="language-bash" data-reactid="405"><code data-reactid="406">$ <span class="token function">npm</span> <span class="token function">install</span> antd --save</code></pre><pre class="language-bash" data-reactid="407"><code data-reactid="408">$ yarn add antd</code></pre><p data-reactid="409"><!-- react-text: 410 -->If you are in a bad network environment，you can try other registries and tools like <!-- /react-text --><a href="https://github.com/cnpm/cnpm" data-reactid="411"><!-- react-text: 412 -->cnpm<!-- /react-text --></a><!-- react-text: 413 -->.<!-- /react-text --></p><h3 id="Import-in-Browser" data-reactid="414"><span data-reactid="415"><!-- react-text: 416 -->Import in Browser<!-- /react-text --></span><a href="#Import-in-Browser" class="anchor" data-reactid="417">#</a></h3><p data-reactid="418"><!-- react-text: 419 -->Add <!-- /react-text --><code data-reactid="420"><!-- react-text: 421 -->script<!-- /react-text --></code><!-- react-text: 422 --> and <!-- /react-text --><code data-reactid="423"><!-- react-text: 424 -->link<!-- /react-text --></code><!-- react-text: 425 --> tags in your browser and use the global variable <!-- /react-text --><code data-reactid="426"><!-- react-text: 427 -->antd<!-- /react-text --></code><!-- react-text: 428 -->.<!-- /react-text --></p><p data-reactid="429"><!-- react-text: 430 -->We provide <!-- /react-text --><code data-reactid="431"><!-- react-text: 432 -->antd.js<!-- /react-text --></code><!-- react-text: 433 --> <!-- /react-text --><code data-reactid="434"><!-- react-text: 435 -->antd.css<!-- /react-text --></code><!-- react-text: 436 --> and <!-- /react-text --><code data-reactid="437"><!-- react-text: 438 -->antd.min.js<!-- /react-text --></code><!-- react-text: 439 --> <!-- /react-text --><code data-reactid="440"><!-- react-text: 441 -->antd.min.css<!-- /react-text --></code><!-- react-text: 442 --> under <!-- /react-text --><code data-reactid="443"><!-- react-text: 444 -->antd/dist<!-- /react-text --></code><!-- react-text: 445 --> in antd&#x27;s npm package. You can also download these files directly from <!-- /react-text --><a href="https://cdnjs.com/libraries/antd" data-reactid="446"><img src="https://img.shields.io/cdnjs/v/antd.svg?style=flat-square" alt="CDNJS" data-reactid="447"/></a><!-- react-text: 448 --> or <!-- /react-text --><a href="https://unpkg.com/" data-reactid="449"><!-- react-text: 450 -->unpkg<!-- /react-text --></a><!-- react-text: 451 -->.<!-- /react-text --></p><blockquote data-reactid="452"><p data-reactid="453"><strong data-reactid="454"><!-- react-text: 455 -->We strongly discourage loading these entire files<!-- /react-text --></strong><!-- react-text: 456 --> this will add bloat to your application and make it more difficult to receive bugfixes and updates. Ant is intended to be used in conjunction with a build tool, such as <!-- /react-text --><a href="https://webpack.github.io/" data-reactid="457"><!-- react-text: 458 -->webpack<!-- /react-text --></a><!-- react-text: 459 -->, which will make it easy to import only the parts of antd that you are using.<!-- /react-text --></p></blockquote><h2 id="Usage" data-reactid="460"><span data-reactid="461"><!-- react-text: 462 -->Usage<!-- /react-text --></span><a href="#Usage" class="anchor" data-reactid="463">#</a></h2><pre class="language-jsx" data-reactid="464"><code data-reactid="465"><span class="token keyword">import</span> <span class="token punctuation">{</span> DatePicker <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'antd'</span><span class="token punctuation">;</span>
ReactDOM<span class="token punctuation">.</span><span class="token function">render</span><span class="token punctuation">(</span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>DatePicker</span> <span class="token punctuation">/></span></span><span class="token punctuation">,</span> mountNode<span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre><p data-reactid="466"><!-- react-text: 467 -->And import stylesheets manually:<!-- /react-text --></p><pre class="language-jsx" data-reactid="468"><code data-reactid="469"><span class="token keyword">import</span> <span class="token string">'antd/dist/antd.css'</span><span class="token punctuation">;</span> <span class="token comment" spellcheck="true">// or 'antd/dist/antd.less'</span></code></pre><h3 id="Use-modularized-antd" data-reactid="470"><span data-reactid="471"><!-- react-text: 472 -->Use modularized antd<!-- /react-text --></span><a href="#Use-modularized-antd" class="anchor" data-reactid="473">#</a></h3><ul data-reactid="474"><li data-reactid="475"><p data-reactid="476"><!-- react-text: 477 -->Use <!-- /react-text --><a href="https://github.com/ant-design/babel-plugin-import" data-reactid="478"><!-- react-text: 479 -->babel-plugin-import<!-- /react-text --></a><!-- react-text: 480 --> (Recommended)<!-- /react-text --></p><pre class="language-js" data-reactid="481"><code data-reactid="482"><span class="token comment" spellcheck="true">// .babelrc or babel-loader option</span>
<span class="token punctuation">{</span>
<span class="token string">"plugins"</span><span class="token punctuation">:</span> <span class="token punctuation">[</span>
<span class="token punctuation">[</span><span class="token string">"import"</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> libraryName<span class="token punctuation">:</span> <span class="token string">"antd"</span><span class="token punctuation">,</span> style<span class="token punctuation">:</span> <span class="token string">"css"</span> <span class="token punctuation">}</span><span class="token punctuation">]</span> <span class="token comment" spellcheck="true">// `style: true` for less</span>
<span class="token punctuation">]</span>
<span class="token punctuation">}</span></code></pre><p data-reactid="483"><!-- react-text: 484 --> This allows you to import components from antd without having to manually import the corresponding stylesheet. The antd babel plugin will automatically import stylesheets.<!-- /react-text --></p><pre class="language-jsx" data-reactid="485"><code data-reactid="486"><span class="token comment" spellcheck="true">// import js and css modularly, parsed by babel-plugin-import</span>
<span class="token keyword">import</span> <span class="token punctuation">{</span> DatePicker <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'antd'</span><span class="token punctuation">;</span></code></pre></li><li data-reactid="487"><p data-reactid="488"><!-- react-text: 489 -->Manually import<!-- /react-text --></p><pre class="language-jsx" data-reactid="490"><code data-reactid="491"><span class="token keyword">import</span> DatePicker <span class="token keyword">from</span> <span class="token string">'antd/lib/date-picker'</span><span class="token punctuation">;</span> <span class="token comment" spellcheck="true">// for js</span>
<span class="token keyword">import</span> <span class="token string">'antd/lib/date-picker/style/css'</span><span class="token punctuation">;</span> <span class="token comment" spellcheck="true">// for css</span>
<span class="token comment" spellcheck="true">// import 'antd/lib/date-picker/style'; // that will import less</span></code></pre></li></ul><h3 id="TypeScript" data-reactid="492"><span data-reactid="493"><!-- react-text: 494 -->TypeScript<!-- /react-text --></span><a href="#TypeScript" class="anchor" data-reactid="495">#</a></h3><pre class="language-js" data-reactid="496"><code data-reactid="497"><span class="token comment" spellcheck="true">// tsconfig.json</span>
<span class="token punctuation">{</span>
<span class="token string">"compilerOptions"</span><span class="token punctuation">:</span> <span class="token punctuation">{</span>
<span class="token string">"moduleResolution"</span><span class="token punctuation">:</span> <span class="token string">"node"</span><span class="token punctuation">,</span>
<span class="token string">"jsx"</span><span class="token punctuation">:</span> <span class="token string">"preserve"</span><span class="token punctuation">,</span>
<span class="token string">"allowSyntheticDefaultImports"</span><span class="token punctuation">:</span> <span class="token boolean">true</span>
<span class="token punctuation">}</span>
<span class="token punctuation">}</span></code></pre><blockquote data-reactid="498"><p data-reactid="499"><!-- react-text: 500 -->Note:<!-- /react-text --></p><ul data-reactid="501"><li data-reactid="502"><p data-reactid="503"><!-- react-text: 504 -->set <!-- /react-text --><code data-reactid="505"><!-- react-text: 506 -->allowSyntheticDefaultImports<!-- /react-text --></code><!-- react-text: 507 --> to prevent <!-- /react-text --><code data-reactid="508"><!-- react-text: 509 -->error TS1192: Module &#x27;react&#x27; has no default export<!-- /react-text --></code><!-- react-text: 510 -->.<!-- /react-text --></p></li><li data-reactid="511"><p data-reactid="512"><!-- react-text: 513 -->Don&#x27;t use @types/antd, antd provides a built-in ts definition already.<!-- /react-text --></p></li></ul></blockquote><h2 id="Links" data-reactid="514"><span data-reactid="515"><!-- react-text: 516 -->Links<!-- /react-text --></span><a href="#Links" class="anchor" data-reactid="517">#</a></h2><ul data-reactid="518"><li data-reactid="519"><p data-reactid="520"><a href="http://ant.design/" data-reactid="521"><!-- react-text: 522 -->Home Page<!-- /react-text --></a></p></li><li data-reactid="523"><p data-reactid="524"><a href="/docs/react/introduce" data-reactid="525">UI library</a></p></li><li data-reactid="526"><p data-reactid="527"><a href="/changelog" data-reactid="528">Change Log</a></p></li><li data-reactid="529"><p data-reactid="530"><a href="https://github.com/dvajs/dva-cli/" data-reactid="531"><!-- react-text: 532 -->Offcial Scaffold Tool<!-- /react-text --></a></p></li><li data-reactid="533"><p data-reactid="534"><a href="http://ant-tool.github.io/" data-reactid="535"><!-- react-text: 536 -->Development Tool<!-- /react-text --></a></p></li><li data-reactid="537"><p data-reactid="538"><a href="http://scaffold.ant.design" data-reactid="539"><!-- react-text: 540 -->Scaffold Market<!-- /react-text --></a></p></li><li data-reactid="541"><p data-reactid="542"><a href="http://react-component.github.io/" data-reactid="543"><!-- react-text: 544 -->rc-components<!-- /react-text --></a></p></li><li data-reactid="545"><p data-reactid="546"><a href="http://mobile.ant.design" data-reactid="547"><!-- react-text: 548 -->Mobile UI<!-- /react-text --></a></p></li><li data-reactid="549"><p data-reactid="550"><a href="https://motion.ant.design" data-reactid="551"><!-- react-text: 552 -->Motion<!-- /react-text --></a></p></li><li data-reactid="553"><p data-reactid="554"><a href="https://github.com/ant-design/ant-design/wiki/Development" data-reactid="555"><!-- react-text: 556 -->Developer Instruction<!-- /react-text --></a></p></li><li data-reactid="557"><p data-reactid="558"><a href="https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B" data-reactid="559"><!-- react-text: 560 -->Versioning Release Note<!-- /react-text --></a></p></li><li data-reactid="561"><p data-reactid="562"><a href="https://github.com/ant-design/ant-design/wiki/FAQ" data-reactid="563"><!-- react-text: 564 -->FAQ<!-- /react-text --></a></p></li><li data-reactid="565"><p data-reactid="566"><a href="http://codepen.io/benjycui/pen/KgPZrE?editors=001" data-reactid="567"><!-- react-text: 568 -->CodePen boilerplate<!-- /react-text --></a><!-- react-text: 569 --> for bug reports<!-- /react-text --></p></li><li data-reactid="570"><p data-reactid="571"><a href="https://github.com/websemantics/awesome-ant-design" data-reactid="572"><!-- react-text: 573 -->Awesome Ant Design<!-- /react-text --></a></p></li><li data-reactid="574"><p data-reactid="575"><a href="/docs/react/customize-theme" data-reactid="576">Customize Theme</a></p></li></ul><h2 id="Companies-using-antd" data-reactid="577"><span data-reactid="578"><!-- react-text: 579 -->Companies using antd<!-- /react-text --></span><a href="#Companies-using-antd" class="anchor" data-reactid="580">#</a></h2><ul data-reactid="581"><li data-reactid="582"><p data-reactid="583"><a href="http://www.antgroup.com/index.htm?locale=en_US" data-reactid="584"><!-- react-text: 585 -->Ant Financial<!-- /react-text --></a></p></li><li data-reactid="586"><p data-reactid="587"><a href="http://www.alibaba.com/" data-reactid="588"><!-- react-text: 589 -->Alibaba<!-- /react-text --></a></p></li><li data-reactid="590"><p data-reactid="591"><a href="http://www.koubei.com/" data-reactid="592"><!-- react-text: 593 -->Koubei<!-- /react-text --></a></p></li><li data-reactid="594"><p data-reactid="595"><a href="http://www.meituan.com" data-reactid="596"><!-- react-text: 597 -->Meituan<!-- /react-text --></a></p></li><li data-reactid="598"><p data-reactid="599"><a href="http://www.xiaojukeji.com/" data-reactid="600"><!-- react-text: 601 -->Didi<!-- /react-text --></a></p></li></ul><blockquote data-reactid="602"><p data-reactid="603"><!-- react-text: 604 -->If your company or product uses Ant Design, let us know <!-- /react-text --><a href="https://github.com/ant-design/ant-design/issues/477" data-reactid="605"><!-- react-text: 606 -->here<!-- /react-text --></a><!-- react-text: 607 -->!<!-- /react-text --></p></blockquote><h2 id="Contributing" data-reactid="608"><span data-reactid="609"><!-- react-text: 610 -->Contributing<!-- /react-text --></span><a href="#Contributing" class="anchor" data-reactid="611">#</a></h2><p data-reactid="612"><!-- react-text: 613 -->Please read our <!-- /react-text --><a href="https://github.com/ant-design/ant-design/blob/master/.github/CONTRIBUTING.md" data-reactid="614"><!-- react-text: 615 -->CONTRIBUTING.md<!-- /react-text --></a><!-- react-text: 616 --> first.<!-- /react-text --></p><p data-reactid="617"><!-- react-text: 618 -->If you&#x27;d like to help us improve antd, just create a <!-- /react-text --><a href="https://github.com/ant-design/ant-design/pulls" data-reactid="619"><!-- react-text: 620 -->Pull Request<!-- /react-text --></a><!-- react-text: 621 -->. Feel free to report bugs and issues <!-- /react-text --><a href="http://new-issue.ant.design/" data-reactid="622"><!-- react-text: 623 -->here<!-- /react-text --></a><!-- react-text: 624 -->.<!-- /react-text --></p><blockquote data-reactid="625"><p data-reactid="626"><!-- react-text: 627 -->If you&#x27;re new to posting issues, we ask that you read <!-- /react-text --><a href="http://www.catb.org/~esr/faqs/smart-questions.html" data-reactid="628"><em data-reactid="629"><!-- react-text: 630 -->How To Ask Questions The Smart Way<!-- /react-text --></em></a><!-- react-text: 631 --> and <!-- /react-text --><a href="https://github.com/seajs/seajs/issues/545" data-reactid="632"><!-- react-text: 633 -->How to Ask a Question in Open Source Community<!-- /react-text --></a><!-- react-text: 634 --> and <!-- /react-text --><a href="http://www.chiark.greenend.org.uk/~sgtatham/bugs.html" data-reactid="635"><!-- react-text: 636 -->How to Report Bugs Effectively<!-- /react-text --></a><!-- react-text: 637 --> prior to posting. Well written bug reports help us help you!<!-- /react-text --></p></blockquote><h2 id="Need-Help?" data-reactid="638"><span data-reactid="639"><!-- react-text: 640 -->Need Help?<!-- /react-text --></span><a href="#Need-Help?" class="anchor" data-reactid="641">#</a></h2><p data-reactid="642"><!-- react-text: 643 -->For questions on how to use antd, please post questions to <!-- /react-text --><a href="http://stackoverflow.com/questions/tagged/antd" data-reactid="644"><!-- react-text: 645 -->stackoverflow<!-- /react-text --></a><!-- react-text: 646 --> using the <!-- /react-text --><code data-reactid="647"><!-- react-text: 648 -->antd<!-- /react-text --></code><!-- react-text: 649 --> tag. If you&#x27;re not finding what you need on stackoverflow, you can find us on <!-- /react-text --><a href="https://gitter.im/ant-design/ant-design-english?utm_source=badge&amp;utm_medium=badge&amp;utm_campaign=pr-badge" data-reactid="650"><!-- react-text: 651 -->gitter<!-- /react-text --></a><!-- react-text: 652 --> as well.<!-- /react-text --></p><p data-reactid="653"><!-- react-text: 654 -->As always, we encourage experienced users to help those who are not familiar with <!-- /react-text --><code data-reactid="655"><!-- react-text: 656 -->antd<!-- /react-text --></code><!-- react-text: 657 -->!<!-- /react-text --></p></section></article></div></div><div class="ant-row" data-reactid="658"><div class="ant-col-xs-24 ant-col-sm-24 ant-col-md-18 ant-col-md-offset-6 ant-col-lg-20 ant-col-lg-offset-4" data-reactid="659"><section class="prev-next-nav" data-reactid="660"><a class="next-page" href="/docs/react/getting-started" data-reactid="661">Getting Started</a></section></div></div></div><footer id="footer" data-reactid="662"><ul data-reactid="663"><li data-reactid="664"><h2 data-reactid="665"><i class="anticon anticon-github" data-reactid="666"></i><!-- react-text: 667 --> GitHub<!-- /react-text --></h2><div data-reactid="668"><a target="_blank " href="https://github.com/ant-design/ant-design" data-reactid="669"><span data-reactid="670">Repository</span></a></div><div data-reactid="671"><a target="_blank " href="https://ant.design/docs/react/customize-theme" data-reactid="672"><span data-reactid="673">Customize Theme</span></a></div><div data-reactid="674"><a target="_blank " href="https://github.com/websemantics/awesome-ant-design" data-reactid="675"><span data-reactid="676">Awesome Ant Design</span></a></div></li><li data-reactid="677"><h2 data-reactid="678"><i class="anticon anticon-link" data-reactid="679"></i><!-- react-text: 680 --> <!-- /react-text --><span data-reactid="681">Links</span></h2><div data-reactid="682"><a href="https://design.alipay.com/" data-reactid="683"><span data-reactid="684">Ant Financial Design Platform</span></a></div><div data-reactid="685"><a href="http://mobile.ant.design" data-reactid="686">Ant Design Mobile</a><span data-reactid="687"> - </span><span data-reactid="688">Mobile UI</span></div><div data-reactid="689"><a href="http://scaffold.ant.design" data-reactid="690">Scaffolds</a><span data-reactid="691"> - </span><span data-reactid="692">Scaffold Market</span></div><div data-reactid="693"><a target="_blank" rel="noopener noreferrer" href="https://github.com/dvajs/dva" data-reactid="694">dva</a><!-- react-text: 695 --> - <!-- /react-text --><span data-reactid="696">Framework</span></div><div data-reactid="697"><a target="_blank" rel="noopener noreferrer" href="https://github.com/dvajs/dva-cli" data-reactid="698">dva-cli</a><!-- react-text: 699 --> -<!-- /react-text --><span data-reactid="700">Developer Tools</span></div><div data-reactid="701"><a target="_blank" rel="noopener noreferrer" href="https://eggjs.org/" data-reactid="702">Egg</a><span data-reactid="703"> - </span><span data-reactid="704">Enterprise Node Framework</span></div><div data-reactid="705"><a target="_blank" rel="noopener noreferrer" href="https://antv.alipay.com/" data-reactid="706">AntV</a><span data-reactid="707"> - </span><span data-reactid="708">Data Visualization</span></div><div data-reactid="709"><a target="_blank" rel="noopener noreferrer" href="http://motion.ant.design" data-reactid="710">Ant Motion</a><span data-reactid="711"> - </span><span data-reactid="712">Motion Solution</span></div><div data-reactid="713"><a target="_blank" rel="noopener noreferrer" href="http://library.ant.design/" data-reactid="714">AntD Library</a><span data-reactid="715"> - </span><span data-reactid="716">Axure library</span></div><div data-reactid="717"><a target="_blank" rel="noopener noreferrer" href="http://ux.ant.design" data-reactid="718">Ant UX</a><span data-reactid="719"> - </span><span data-reactid="720">Sitemap Template</span></div></li><li data-reactid="721"><h2 data-reactid="722"><i class="anticon anticon-customer-service" data-reactid="723"></i><!-- react-text: 724 --> <!-- /react-text --><span data-reactid="725">Community</span></h2><div data-reactid="726"><a href="/changelog" data-reactid="727"><span data-reactid="728">Change Log</span></a></div><div data-reactid="729"><a target="_blank" rel="noopener noreferrer" href="https://github.com/ant-design/ant-design/wiki/FAQ" data-reactid="730"><span data-reactid="731">FAQ</span></a></div><div data-reactid="732"><a target="_blank" rel="noopener noreferrer" href="https://gitter.im/ant-design/ant-design" data-reactid="733"><span data-reactid="734">Chat Room (中文)</span></a></div><div data-reactid="735"><a target="_blank" rel="noopener noreferrer" href="https://gitter.im/ant-design/ant-design-english" data-reactid="736"><span data-reactid="737">Chat Room (English)</span></a></div><div data-reactid="738"><a target="_blank" rel="noopener noreferrer" href="http://new-issue.ant.design/" data-reactid="739"><span data-reactid="740">Bug Report</span></a></div><div data-reactid="741"><a target="_blank" rel="noopener noreferrer" href="https://github.com/ant-design/ant-design/issues" data-reactid="742"><span data-reactid="743">Issues</span></a></div><div data-reactid="744"><a target="_blank" rel="noopener noreferrer" href="http://stackoverflow.com/questions/tagged/antd" data-reactid="745"><span data-reactid="746">StackOverflow</span></a></div><div data-reactid="747"><a target="_blank" rel="noopener noreferrer" href="https://segmentfault.com/t/antd" data-reactid="748"><span data-reactid="749">SegmentFault</span></a></div></li><li data-reactid="750"><h2 data-reactid="751"><!-- react-text: 752 -->Copyright © <!-- /react-text --><!-- react-text: 753 -->2017<!-- /react-text --></h2><div data-reactid="754"><span data-reactid="755">Created by AIUX</span></div><div data-reactid="756"><!-- react-text: 757 -->Built with <!-- /react-text --><a target="_blank" rel="noopener noreferrer" href="https://github.com/benjycui/bisheng" data-reactid="758">BiSheng</a></div></li></ul></footer></div>
</div>
<script src="/common.js"></script>
<script src="/index.js"></script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink