Files
ant-design/docs/pattern/navigation-cn.html
T
2017-03-11 12:51:12 +08:00

109 lines
25 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.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>
</head>
<body>
<div id="react-content">
<div class="page-wrapper" data-reactroot="" data-reactid="1" data-react-checksum="-11147636"><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="/index-cn" 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">搜索组件...</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">EN</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.8.1" style="display:block;opacity:1;" data-reactid="28">2.8.1</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="/index-cn" data-reactid="33"><span data-reactid="34">首页</span></a></li><li class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="35"><a href="/docs/spec/introduce-cn" data-reactid="36"><span data-reactid="37">规范</span></a></li><li class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="38"><a href="/docs/react/introduce-cn" data-reactid="39"><span data-reactid="40">组件</span></a></li><li class="ant-menu-item-selected ant-menu-item" role="menuitem" aria-selected="true" data-reactid="41"><a href="/docs/pattern/navigation-cn" data-reactid="42"><span data-reactid="43">模式</span></a></li><li class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="44"><a href="/docs/resource/download-cn" data-reactid="45"><span data-reactid="46">资源</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/pattern/navigation-cn" data-reactid="52">导航</a></li><li style="padding-left:24px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="53"><a href="/docs/pattern/form-cn" data-reactid="54">表单</a></li><li style="padding-left:24px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="55"><a href="/docs/pattern/list-cn" data-reactid="56">列表</a></li><li style="padding-left:24px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="57"><a href="/docs/pattern/table-cn" data-reactid="58">表格</a></li><li style="padding-left:24px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="59"><a href="/docs/pattern/complex-table-cn" data-reactid="60">表格:复杂数据</a></li><li style="padding-left:24px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="61"><a href="/docs/pattern/advanced-search-cn" data-reactid="62">高级搜索</a></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="63"><article class="markdown" data-reactid="64"><h1 data-reactid="65"><!-- react-text: 66 -->导航<!-- /react-text --><a class="edit-button" href="https://github.com/ant-design/ant-design/edit/master/docs/pattern/navigation.md" data-reactid="67"><i class="anticon anticon-edit" data-reactid="68"></i></a></h1><section class="markdown" data-reactid="69"><p data-reactid="70"><!-- react-text: 71 -->在广义上,任何告知用户他在哪里,他能去什么地方以及如何到达那里的方式,都可以称之为导航。而我们将中后台常见的导航方式进行提炼和封装,帮助设计者快速构建清晰和流畅的系统。当设计者使用导航或者自定义一些导航结构时,请注意:<!-- /react-text --></p><ol data-reactid="72"><li data-reactid="73"><p data-reactid="74"><!-- react-text: 75 -->尽可能提供标示、上下文线索以及网站地图,避免用户迷路;<!-- /react-text --></p></li><li data-reactid="76"><p data-reactid="77"><!-- react-text: 78 -->保持导航样式和行为一致或者减少导航数量,降低用户学习成本;<!-- /react-text --></p></li><li data-reactid="79"><p data-reactid="80"><!-- react-text: 81 -->尽可能减少页面间的跳转(eg:一个常见任务需要多个页面跳转时,请减少至一至两次),让用户移动距离保持简短。<!-- /react-text --></p></li></ol></section><section class="toc" data-reactid="82"><ul data-reactid="83"><li data-reactid="84"><a class="bisheng-toc-h2" href="#常见导航" data-reactid="85"><!-- react-text: 86 -->常见导航<!-- /react-text --></a></li><li data-reactid="87"><a class="bisheng-toc-h2" href="#侧栏导航" data-reactid="88"><!-- react-text: 89 -->侧栏导航<!-- /react-text --></a></li><li data-reactid="90"><a class="bisheng-toc-h2" href="#顶部导航" data-reactid="91"><!-- react-text: 92 -->顶部导航<!-- /react-text --></a></li></ul></section><section class="markdown" data-reactid="93"><h2 id="常见导航" data-reactid="94"><span data-reactid="95"><!-- react-text: 96 -->常见导航<!-- /react-text --></span><a href="#常见导航" class="anchor" data-reactid="97">#</a></h2><table style="font-size:12px;float:right;width:600px;margin-left:60px;margin-bottom:100px;" data-reactid="98"><tbody data-reactid="99"><tr data-reactid="100"><th data-reactid="101"></th><th data-reactid="102"><!-- react-text: 103 -->侧栏导航<!-- /react-text --></th><th data-reactid="104"><!-- react-text: 105 -->顶部导航<!-- /react-text --></th></tr><tr data-reactid="106"><th data-reactid="107"><!-- react-text: 108 -->优点<!-- /react-text --></th><td data-reactid="109"><!-- react-text: 110 -->导航的层级扩展性强;水平空间利用率高,可展示更多内容;导航可以固定,使得用户在操作和浏览时可以快速定位和切换当前位置,非常高效。<!-- /react-text --></td><td data-reactid="111"><!-- react-text: 112 -->人的浏览习惯是自上而下的,便于浏览和点击;通常将内容放在固定尺寸(例如:1208px)内,整个页面排版稳定,不受用户终端显示器影响。<!-- /react-text --></td></tr><tr data-reactid="113"><th data-reactid="114"><!-- react-text: 115 -->缺点<!-- /react-text --></th><td data-reactid="116"><!-- react-text: 117 -->内容区域一般放置在栅格上,所以排版受用户终端显示器影响大。<!-- /react-text --></td><td data-reactid="118"><!-- react-text: 119 -->目前显示器多为宽屏,顶部导航对垂直空间占用率大,而对水平空间利用率低;由于中英文都是横向书写,顶部导航会限制导航类目的数量和长度。<!-- /react-text --></td></tr><tr data-reactid="120"><th data-reactid="121"><!-- react-text: 122 -->总结<!-- /react-text --></th><td data-reactid="123"><!-- react-text: 124 -->适用在操作性强、中后台管理性质的应用。<!-- /react-text --></td><td data-reactid="125"><!-- react-text: 126 -->一般适用在浏览性强、门户性质的网站,以及一些比较前台化的应用。<!-- /react-text --></td></tr></tbody></table><p data-reactid="127"><!-- react-text: 128 -->我们将常见的导航模式分为:侧栏导航和顶部导航,两者各有优缺点,设计者可以根据各自的业务需求进行选择。<!-- /react-text --></p><p data-reactid="129"><!-- react-text: 130 -->前端实现代码可以参考 <!-- /react-text --><a href="/docs/spec/layout-cn#docs-spec-layout-demo-top" data-reactid="131">常用布局</a><!-- react-text: 132 --><!-- /react-text --></p><h2 id="侧栏导航" data-reactid="133"><span data-reactid="134"><!-- react-text: 135 -->侧栏导航<!-- /react-text --></span><a href="#侧栏导航" class="anchor" data-reactid="136">#</a></h2><hr data-reactid="137"/><div class="preview-image-boxes clearfix" data-reactid="138"><div class="preview-image-box" data-reactid="139"><div class="preview-image-wrapper false false" data-reactid="140"><img class="preview-img no-padding" src="https://os.alipayobjects.com/rmsportal/hutiGZWQYmIspjw.png" alt="结构示例" data-reactid="141"/></div><div class="preview-image-title" data-reactid="142">结构示例</div><div class="preview-image-description" data-reactid="143"></div><!-- react-empty: 144 --></div></div><p data-reactid="145"><!-- react-text: 146 -->导航的结构由以下几部分组成。<!-- /react-text --></p><ol data-reactid="147"><li data-reactid="148"><p data-reactid="149"><!-- react-text: 150 -->产品 Logo 和名称<!-- /react-text --></p></li><li data-reactid="151"><p data-reactid="152"><!-- react-text: 153 -->业务类目<!-- /react-text --></p></li><li data-reactid="154"><p data-reactid="155"><!-- react-text: 156 -->登陆工具<!-- /react-text --></p></li><li data-reactid="157"><p data-reactid="158"><!-- react-text: 159 -->面包屑(可选)<!-- /react-text --></p></li></ol><h4 id="关于面包屑" data-reactid="160"><span data-reactid="161"><!-- react-text: 162 -->关于面包屑<!-- /react-text --></span><a href="#关于面包屑" class="anchor" data-reactid="163">#</a></h4><blockquote data-reactid="164"><ol data-reactid="165"><li data-reactid="166"><p data-reactid="167"><!-- react-text: 168 -->尽可能不使用面包屑,尤其是当前页面的导航能清晰的告诉用户他在哪里时。<!-- /react-text --></p></li><li data-reactid="169"><p data-reactid="170"><!-- react-text: 171 -->面包屑可以分为这几类:<!-- /react-text --></p><ul data-reactid="172"><li data-reactid="173"><p data-reactid="174"><!-- react-text: 175 -->路径型:是一个动态显示用户到达页面经过的途径。<!-- /react-text --></p></li><li data-reactid="176"><p data-reactid="177"><!-- react-text: 178 -->位置型:位置型是固定的,显示了页面在网站结构中的位置。<!-- /react-text --></p></li><li data-reactid="179"><p data-reactid="180"><!-- react-text: 181 -->属性型:属性型给出当前页面的分类信息。<!-- /react-text --></p></li></ul></li></ol></blockquote><p data-reactid="182"><br data-reactid="183"/></p><div class="preview-image-boxes clearfix" data-reactid="184"><div class="preview-image-box" data-reactid="185"><div class="preview-image-wrapper false false" data-reactid="186"><img class="preview-img no-padding" src="https://os.alipayobjects.com/rmsportal/IeuIHdFfKCIABHV.png" alt="一级类目" data-reactid="187"/></div><div class="preview-image-title" data-reactid="188">一级类目</div><div class="preview-image-description" data-reactid="189"></div><!-- react-empty: 190 --></div></div><div class="preview-image-boxes clearfix" data-reactid="191"><div class="preview-image-box" data-reactid="192"><div class="preview-image-wrapper false false" data-reactid="193"><img class="preview-img no-padding" src="https://os.alipayobjects.com/rmsportal/kAbbeJekohMtubV.png" alt="二级类目" data-reactid="194"/></div><div class="preview-image-title" data-reactid="195">二级类目</div><div class="preview-image-description" data-reactid="196"></div><!-- react-empty: 197 --></div></div><div class="preview-image-boxes clearfix" data-reactid="198"><div class="preview-image-box" data-reactid="199"><div class="preview-image-wrapper false false" data-reactid="200"><img class="preview-img no-padding" src="https://os.alipayobjects.com/rmsportal/qaOifucSTWooBTL.png" alt="三级类目及以上" data-reactid="201"/></div><div class="preview-image-title" data-reactid="202">三级类目及以上</div><div class="preview-image-description" data-reactid="203"></div><!-- react-empty: 204 --></div></div><p data-reactid="205"><!-- react-text: 206 -->我们定义了不同类目层级所对应的导航样式。<!-- /react-text --></p><h2 id="顶部导航" data-reactid="207"><span data-reactid="208"><!-- react-text: 209 -->顶部导航<!-- /react-text --></span><a href="#顶部导航" class="anchor" data-reactid="210">#</a></h2><hr data-reactid="211"/><div class="preview-image-boxes clearfix" data-reactid="212"><div class="preview-image-box" data-reactid="213"><div class="preview-image-wrapper false false" data-reactid="214"><img class="preview-img no-padding" src="https://os.alipayobjects.com/rmsportal/MVccMQxgCeYfwjS.png" alt="结构示例" data-reactid="215"/></div><div class="preview-image-title" data-reactid="216">结构示例</div><div class="preview-image-description" data-reactid="217"></div><!-- react-empty: 218 --></div></div><p data-reactid="219"><!-- react-text: 220 -->导航的结构由以下几部分组成。<!-- /react-text --></p><ol data-reactid="221"><li data-reactid="222"><p data-reactid="223"><!-- react-text: 224 -->产品 Logo 和名称<!-- /react-text --></p></li><li data-reactid="225"><p data-reactid="226"><!-- react-text: 227 -->业务类目<!-- /react-text --></p></li><li data-reactid="228"><p data-reactid="229"><!-- react-text: 230 -->登陆工具<!-- /react-text --></p></li><li data-reactid="231"><p data-reactid="232"><!-- react-text: 233 -->面包屑(可选)<!-- /react-text --></p></li></ol><p data-reactid="234"><br data-reactid="235"/></p><div class="preview-image-boxes clearfix" data-reactid="236"><div class="preview-image-box" data-reactid="237"><div class="preview-image-wrapper false false" data-reactid="238"><img class="preview-img no-padding" src="https://os.alipayobjects.com/rmsportal/KvEsIDOYzknbsPT.png" alt="一级类目" data-reactid="239"/></div><div class="preview-image-title" data-reactid="240">一级类目</div><div class="preview-image-description" data-reactid="241"></div><!-- react-empty: 242 --></div></div><div class="preview-image-boxes clearfix" data-reactid="243"><div class="preview-image-box" data-reactid="244"><div class="preview-image-wrapper false false" data-reactid="245"><img class="preview-img no-padding" src="https://os.alipayobjects.com/rmsportal/xXaCRVPIfmjDyIL.png" alt="二级类目" data-reactid="246"/></div><div class="preview-image-title" data-reactid="247">二级类目</div><div class="preview-image-description" data-reactid="248"></div><!-- react-empty: 249 --></div></div><div class="preview-image-boxes clearfix" data-reactid="250"><div class="preview-image-box" data-reactid="251"><div class="preview-image-wrapper false false" data-reactid="252"><img class="preview-img no-padding" src="https://os.alipayobjects.com/rmsportal/ollkHeFUFQElelm.png" alt="三级类目及以上" data-reactid="253"/></div><div class="preview-image-title" data-reactid="254">三级类目及以上</div><div class="preview-image-description" data-reactid="255"></div><!-- react-empty: 256 --></div></div><p data-reactid="257"><!-- react-text: 258 -->不同类目层级。<!-- /react-text --></p></section></article></div></div><div class="ant-row" data-reactid="259"><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="260"><section class="prev-next-nav" data-reactid="261"><a class="next-page" href="/docs/pattern/form-cn" data-reactid="262">表单</a></section></div></div></div><footer id="footer" data-reactid="263"><ul data-reactid="264"><li data-reactid="265"><h2 data-reactid="266"><i class="anticon anticon-github" data-reactid="267"></i><!-- react-text: 268 --> GitHub<!-- /react-text --></h2><div data-reactid="269"><a target="_blank " href="https://github.com/ant-design/ant-design" data-reactid="270"><span data-reactid="271">仓库</span></a></div><div data-reactid="272"><a target="_blank " href="https://ant.design/docs/react/customize-theme" data-reactid="273"><span data-reactid="274">定制主题</span></a></div><div data-reactid="275"><a target="_blank " href="https://github.com/websemantics/awesome-ant-design" data-reactid="276"><span data-reactid="277">Awesome Ant Design</span></a></div></li><li data-reactid="278"><h2 data-reactid="279"><i class="anticon anticon-link" data-reactid="280"></i><!-- react-text: 281 --> <!-- /react-text --><span data-reactid="282">相关站点</span></h2><div data-reactid="283"><a href="http://mobile.ant.design" data-reactid="284">Ant Design Mobile</a><span data-reactid="285"> - </span><span data-reactid="286">移动版</span></div><div data-reactid="287"><a target="_blank" rel="noopener noreferrer" href="https://github.com/dvajs/dva" data-reactid="288">dva</a><!-- react-text: 289 --> - <!-- /react-text --><span data-reactid="290">应用框架</span></div><div data-reactid="291"><a target="_blank" rel="noopener noreferrer" href="https://github.com/dvajs/dva-cli" data-reactid="292">dva-cli</a><!-- react-text: 293 --> -<!-- /react-text --><span data-reactid="294">开发工具</span></div><div data-reactid="295"><a target="_blank" rel="noopener noreferrer" href="https://eggjs.org/" data-reactid="296">Egg</a><span data-reactid="297"> - </span><span data-reactid="298">企业级 Node 开发框架</span></div><div data-reactid="299"><a target="_blank" rel="noopener noreferrer" href="https://antv.alipay.com/" data-reactid="300">AntV</a><span data-reactid="301"> - </span><span data-reactid="302">数据可视化</span></div><div data-reactid="303"><a target="_blank" rel="noopener noreferrer" href="http://motion.ant.design" data-reactid="304">Ant Motion</a><span data-reactid="305"> - </span><span data-reactid="306">设计动效</span></div><div data-reactid="307"><a target="_blank" rel="noopener noreferrer" href="http://library.ant.design/" data-reactid="308">AntD Library</a><span data-reactid="309"> - </span><span data-reactid="310">Axure 部件库</span></div><div data-reactid="311"><a target="_blank" rel="noopener noreferrer" href="http://ux.ant.design" data-reactid="312">Ant UX</a><span data-reactid="313"> - </span><span data-reactid="314">页面逻辑素材</span></div></li><li data-reactid="315"><h2 data-reactid="316"><i class="anticon anticon-customer-service" data-reactid="317"></i><!-- react-text: 318 --> <!-- /react-text --><span data-reactid="319">社区</span></h2><div data-reactid="320"><a href="/changelog" data-reactid="321"><span data-reactid="322">更新记录</span></a></div><div data-reactid="323"><a target="_blank" rel="noopener noreferrer" href="https://github.com/ant-design/ant-design/wiki/FAQ" data-reactid="324"><span data-reactid="325">常见问题</span></a></div><div data-reactid="326"><a target="_blank" rel="noopener noreferrer" href="https://gitter.im/ant-design/ant-design" data-reactid="327"><span data-reactid="328">在线讨论</span></a></div><div data-reactid="329"><a target="_blank" rel="noopener noreferrer" href="https://github.com/ant-design/ant-design/issues/new" data-reactid="330"><span data-reactid="331">报告 Bug</span></a></div><div data-reactid="332"><a target="_blank" rel="noopener noreferrer" href="http://stackoverflow.com/questions/tagged/antd" data-reactid="333"><span data-reactid="334">StackOverflow</span></a></div><div data-reactid="335"><a target="_blank" rel="noopener noreferrer" href="https://segmentfault.com/t/antd" data-reactid="336"><span data-reactid="337">SegmentFault</span></a></div></li><li data-reactid="338"><h2 data-reactid="339"><!-- react-text: 340 -->Copyright © <!-- /react-text --><!-- react-text: 341 -->2017<!-- /react-text --></h2><div data-reactid="342"><span data-reactid="343">蚂蚁金服体验技术部出品</span></div><div data-reactid="344"><!-- react-text: 345 -->Built with <!-- /react-text --><a target="_blank" rel="noopener noreferrer" href="https://github.com/benjycui/bisheng" data-reactid="346">BiSheng</a></div></li></ul></footer></div>
</div>
<script src="/common.js"></script>
<script src="/index.js"></script>
</body>
</html>