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

109 lines
27 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="600017022"><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-selected ant-menu-item" role="menuitem" aria-selected="true" 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" role="menuitem" aria-selected="false" 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" role="menuitem" aria-selected="false" data-reactid="51"><a href="/docs/spec/introduce-cn" data-reactid="52">Ant Design</a></li><li style="padding-left:24px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="53"><a href="/docs/spec/cases-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/spec/feature-cn" data-reactid="56">基本理念</a></li><li class="ant-menu-submenu-inline ant-menu-submenu-open ant-menu-submenu-selected ant-menu-submenu" data-reactid="57"><div style="padding-left:24px;" class="ant-menu-submenu-title" aria-expanded="true" aria-owns="设计原则$Menu" aria-haspopup="true" data-reactid="58"><h4 data-reactid="59">设计原则</h4></div><ul class="ant-menu ant-menu-inline ant-menu-sub" role="menu" aria-activedescendant="" id="设计原则$Menu" data-reactid="60"><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="61"><a href="/docs/spec/principle-cn" data-reactid="62">引言</a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="63"><a href="/docs/spec/proximity-cn" data-reactid="64">亲密性</a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="65"><a href="/docs/spec/alignment-cn" data-reactid="66">对齐</a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="67"><a href="/docs/spec/contrast-cn" data-reactid="68">对比</a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="69"><a href="/docs/spec/repetition-cn" data-reactid="70">重复</a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="71"><a href="/docs/spec/direct-cn" data-reactid="72">直截了当</a></li><li style="padding-left:48px;" class="ant-menu-item-selected ant-menu-item" role="menuitem" aria-selected="true" data-reactid="73"><a href="/docs/spec/lightweight-cn" data-reactid="74">简化交互</a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="75"><a href="/docs/spec/stay-cn" data-reactid="76">足不出户</a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="77"><a href="/docs/spec/invitation-cn" data-reactid="78">提供邀请</a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="79"><a href="/docs/spec/transition-cn" data-reactid="80">巧用过渡</a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="81"><a href="/docs/spec/reaction-cn" data-reactid="82">即时反应</a></li></ul></li><li class="ant-menu-submenu-inline ant-menu-submenu-open ant-menu-submenu" data-reactid="83"><div style="padding-left:24px;" class="ant-menu-submenu-title" aria-expanded="true" aria-owns="设计基础$Menu" aria-haspopup="true" data-reactid="84"><h4 data-reactid="85">设计基础</h4></div><ul class="ant-menu ant-menu-inline ant-menu-sub" role="menu" aria-activedescendant="" id="设计基础$Menu" data-reactid="86"><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="87"><a href="/docs/spec/font-cn" data-reactid="88">字体</a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="89"><a href="/docs/spec/typography-cn" data-reactid="90">排版</a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="91"><a href="/docs/spec/colors-cn" data-reactid="92">色彩</a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="93"><a href="/docs/spec/layout-cn" data-reactid="94">常用布局</a></li><li style="padding-left:48px;" class="ant-menu-item" role="menuitem" aria-selected="false" data-reactid="95"><a href="/docs/spec/motion-cn" data-reactid="96">组件动画</a></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="97"><article class="markdown" data-reactid="98"><h1 data-reactid="99"><!-- react-text: 100 -->简化交互<!-- /react-text --><a class="edit-button" href="https://github.com/ant-design/ant-design/edit/master/docs/spec/lightweight.zh-CN.md" data-reactid="101"><i class="anticon anticon-edit" data-reactid="102"></i></a></h1><section class="markdown" data-reactid="103"><p data-reactid="104"><!-- react-text: 105 -->根据费茨法则(Fitts&#x27;s Law)所描述的,如果用户鼠标移动距离越少、对象相对目标越大,那么用户越容易操作。通过运用上下文工具(即:放在内容中的操作工具),使内容和操作融合,从而简化交互。<!-- /react-text --></p><blockquote data-reactid="106"><p data-reactid="107"><strong data-reactid="108"><!-- react-text: 109 --> 费茨法则 <!-- /react-text --></strong><!-- react-text: 110 --> :到达目标的时间是到达目标的距离与目标大小的函数,具体:<!-- /react-text --><img src="https://os.alipayobjects.com/rmsportal/wAcbQmeqTWDqsnu.png" width="150" data-reactid="111"/><!-- react-text: 112 -->。其中:1.设备当前位置和目标位置的距离(D);2.目标的大小(W)。距离越长,所用时间越长;目标越大,所用时间越短。<!-- /react-text --></p></blockquote></section><section class="toc" data-reactid="113"><ul data-reactid="114"><li data-reactid="115"><a class="bisheng-toc-h2" href="#实时可见工具" data-reactid="116"><!-- react-text: 117 -->实时可见工具<!-- /react-text --></a></li><li data-reactid="118"><a class="bisheng-toc-h2" href="#悬停即现工具" data-reactid="119"><!-- react-text: 120 -->悬停即现工具<!-- /react-text --></a></li><li data-reactid="121"><a class="bisheng-toc-h2" href="#开关显示工具" data-reactid="122"><!-- react-text: 123 -->开关显示工具<!-- /react-text --></a></li><li data-reactid="124"><a class="bisheng-toc-h2" href="#交互中的工具" data-reactid="125"><!-- react-text: 126 -->交互中的工具<!-- /react-text --></a></li><li data-reactid="127"><a class="bisheng-toc-h2" href="#可视区域-≠-可点击区域" data-reactid="128"><!-- react-text: 129 -->可视区域 ≠ 可点击区域<!-- /react-text --></a></li></ul></section><section class="markdown" data-reactid="130"><h2 id="实时可见工具" data-reactid="131"><span data-reactid="132"><!-- react-text: 133 -->实时可见工具<!-- /react-text --></span><a href="#实时可见工具" class="anchor" data-reactid="134">#</a></h2><div class="preview-image-boxes clearfix" data-reactid="135"><div class="preview-image-box" data-reactid="136"><div class="preview-image-wrapper false false" data-reactid="137"><img class="preview-img" src="https://os.alipayobjects.com/rmsportal/sfytaOSssRrdYFg.png" alt="实时可见工具示例 --摘自知乎" data-reactid="138"/></div><div class="preview-image-title" data-reactid="139">实时可见工具示例 --摘自知乎</div><div class="preview-image-description" data-reactid="140">状态一:在文案中出现一个相对明显的点击区域;<br>状态二:鼠标悬停时,鼠标『指针』变为『手型』,底色发生变化,邀请用户点击。<br>状态三:鼠标点击后,和未点击前有明显的区分。</div><!-- react-empty: 141 --></div></div><p data-reactid="142"><!-- react-text: 143 -->如果某个操作非常重要,就应该把它放在界面中,并实时可见。<!-- /react-text --></p><p data-reactid="144"><br data-reactid="145"/></p><hr data-reactid="146"/><h2 id="悬停即现工具" data-reactid="147"><span data-reactid="148"><!-- react-text: 149 -->悬停即现工具<!-- /react-text --></span><a href="#悬停即现工具" class="anchor" data-reactid="150">#</a></h2><div class="preview-image-boxes clearfix" data-reactid="151"><div class="preview-image-box" data-reactid="152"><div class="preview-image-wrapper false false" data-reactid="153"><img class="preview-img" src="https://os.alipayobjects.com/rmsportal/AUiWMlbxCvpBFyA.png" alt="悬停即现工具示例" data-reactid="154"/></div><div class="preview-image-title" data-reactid="155">悬停即现工具示例</div><div class="preview-image-description" data-reactid="156">鼠标悬停时,出现操作项。</div><!-- react-empty: 157 --></div></div><p data-reactid="158"><!-- react-text: 159 -->如果某个操作不那么重要,或者使用『实时可见工具』过于啰嗦会影响用户阅读时,可以在悬停在该对象上时展示操作项。<!-- /react-text --></p><p data-reactid="160"><br data-reactid="161"/></p><hr data-reactid="162"/><h2 id="开关显示工具" data-reactid="163"><span data-reactid="164"><!-- react-text: 165 -->开关显示工具<!-- /react-text --></span><a href="#开关显示工具" class="anchor" data-reactid="166">#</a></h2><div class="preview-image-boxes clearfix" data-reactid="167"><div class="preview-image-box" data-reactid="168"><div class="preview-image-wrapper false false" data-reactid="169"><img class="preview-img" src="https://os.alipayobjects.com/rmsportal/uGWcpAFgWdynxBy.png" alt="开关显示工具示例" data-reactid="170"/></div><div class="preview-image-title" data-reactid="171">开关显示工具示例</div><div class="preview-image-description" data-reactid="172">用户点击『修改』后,Table 中『文本』变成『输入框』,开启编辑功能。</div><!-- react-empty: 173 --></div></div><p data-reactid="174"><!-- react-text: 175 -->如果某些操作只需要在特定模式时显示,可以通过开关来实现。<!-- /react-text --></p><p data-reactid="176"><br data-reactid="177"/></p><hr data-reactid="178"/><h2 id="交互中的工具" data-reactid="179"><span data-reactid="180"><!-- react-text: 181 -->交互中的工具<!-- /react-text --></span><a href="#交互中的工具" class="anchor" data-reactid="182">#</a></h2><div class="preview-image-boxes clearfix" data-reactid="183"><div class="preview-image-box" data-reactid="184"><div class="preview-image-wrapper false false" data-reactid="185"><img class="preview-img" src="https://os.alipayobjects.com/rmsportal/STvIHSgnVAHOVHl.png" alt="推荐示例" data-reactid="186"/></div><div class="preview-image-title" data-reactid="187">推荐示例</div><div class="preview-image-description" data-reactid="188">鼠标悬停时,出现 Tooltips 进行提示,用户点击内容直接复制。</div><!-- react-empty: 189 --></div></div><div class="preview-image-boxes clearfix" data-reactid="190"><div class="preview-image-box" data-reactid="191"><div class="preview-image-wrapper false false" data-reactid="192"><img class="preview-img" src="https://os.alipayobjects.com/rmsportal/aRihOoBCQHGATBA.png" alt="推荐示例" data-reactid="193"/></div><div class="preview-image-title" data-reactid="194">推荐示例</div><div class="preview-image-description" data-reactid="195">鼠标滑选/双击时,系统自动复制该部分内容。通过大胆猜测用户的行为,并帮助完成,给用户小惊喜。</div><!-- react-empty: 196 --></div></div><div class="preview-image-boxes clearfix" data-reactid="197"><div class="preview-image-box" data-reactid="198"><div class="preview-image-wrapper false false" data-reactid="199"><img class="preview-img" src="https://os.alipayobjects.com/rmsportal/MfbnQfAJhQfIODY.png" alt="不推荐示例" data-reactid="200"/></div><div class="preview-image-title" data-reactid="201">不推荐示例</div><div class="preview-image-description" data-reactid="202">在可复制内容的附近出现『图标』,点击后复制。</div><!-- react-empty: 203 --></div></div><p data-reactid="204"><!-- react-text: 205 -->如果操作不重要或者可以通过其他途径完成时,可以将工具放置在用户的操作流程中,减少界面元素,降低认知负担,给用户小惊喜。<!-- /react-text --></p><p data-reactid="206"><!-- react-text: 207 -->此处也可以运用<!-- /react-text --><a href="/docs/spec/invitation-cn" data-reactid="208">『提供邀请』</a><!-- react-text: 209 --> 相关的知识点。<!-- /react-text --></p><p data-reactid="210"><br data-reactid="211"/></p><hr data-reactid="212"/><h2 id="可视区域-≠-可点击区域" data-reactid="213"><span data-reactid="214"><!-- react-text: 215 -->可视区域 ≠ 可点击区域<!-- /react-text --></span><a href="#可视区域-≠-可点击区域" class="anchor" data-reactid="216">#</a></h2><div class="preview-image-boxes clearfix" data-reactid="217"><div class="preview-image-box" data-reactid="218"><div class="preview-image-wrapper false false" data-reactid="219"><img class="preview-img" src="https://os.alipayobjects.com/rmsportal/bCrBxGPJiDvkyOH.png" alt="文字链热区示例" data-reactid="220"/></div><div class="preview-image-title" data-reactid="221">文字链热区示例</div><div class="preview-image-description" data-reactid="222">当悬浮在 ID 所在的文字链单元格时,鼠标『指针』随即变为『手型』,单击即可跳转。</div><!-- react-empty: 223 --></div></div><p data-reactid="224"><!-- react-text: 225 -->在使用 Table 时,文字链的点击范围受到文字长短影响,可以设置整个单元格为热区,以便用户触发。<!-- /react-text --></p><p data-reactid="226"><br data-reactid="227"/></p><div class="preview-image-boxes clearfix" data-reactid="228"><div class="preview-image-box" data-reactid="229"><div class="preview-image-wrapper false false" data-reactid="230"><img class="preview-img" src="https://os.alipayobjects.com/rmsportal/dSehXwUuXDFDhJO.png" alt="按钮热区示例" data-reactid="231"/></div><div class="preview-image-title" data-reactid="232">按钮热区示例</div><div class="preview-image-description" data-reactid="233">鼠标移入按钮附近,即可激活 Hover 状态。</div><!-- react-empty: 234 --></div></div><p data-reactid="235"><!-- react-text: 236 -->当需要增强按钮的响应性时,可以通过增加用户点击热区的范围,而不是增大按钮形状,从而增强响应性,又不缺失美感。<!-- /react-text --></p><blockquote data-reactid="237"><p data-reactid="238"><!-- react-text: 239 -->注:在移动端尤其适用。<!-- /react-text --></p></blockquote></section></article></div></div><div class="ant-row" data-reactid="240"><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="241"><section class="prev-next-nav" data-reactid="242"><a class="prev-page" href="/docs/spec/direct-cn" data-reactid="243">直截了当</a><a class="next-page" href="/docs/spec/stay-cn" data-reactid="244">足不出户</a></section></div></div></div><footer id="footer" data-reactid="245"><ul data-reactid="246"><li data-reactid="247"><h2 data-reactid="248"><i class="anticon anticon-github" data-reactid="249"></i><!-- react-text: 250 --> GitHub<!-- /react-text --></h2><div data-reactid="251"><a target="_blank " href="https://github.com/ant-design/ant-design" data-reactid="252"><span data-reactid="253">仓库</span></a></div><div data-reactid="254"><a target="_blank " href="https://ant.design/docs/react/customize-theme" data-reactid="255"><span data-reactid="256">定制主题</span></a></div><div data-reactid="257"><a target="_blank " href="https://github.com/websemantics/awesome-ant-design" data-reactid="258"><span data-reactid="259">Awesome Ant Design</span></a></div></li><li data-reactid="260"><h2 data-reactid="261"><i class="anticon anticon-link" data-reactid="262"></i><!-- react-text: 263 --> <!-- /react-text --><span data-reactid="264">相关站点</span></h2><div data-reactid="265"><a href="http://mobile.ant.design" data-reactid="266">Ant Design Mobile</a><span data-reactid="267"> - </span><span data-reactid="268">移动版</span></div><div data-reactid="269"><a target="_blank" rel="noopener noreferrer" href="https://github.com/dvajs/dva" data-reactid="270">dva</a><!-- react-text: 271 --> - <!-- /react-text --><span data-reactid="272">应用框架</span></div><div data-reactid="273"><a target="_blank" rel="noopener noreferrer" href="https://github.com/dvajs/dva-cli" data-reactid="274">dva-cli</a><!-- react-text: 275 --> -<!-- /react-text --><span data-reactid="276">开发工具</span></div><div data-reactid="277"><a target="_blank" rel="noopener noreferrer" href="https://eggjs.org/" data-reactid="278">Egg</a><span data-reactid="279"> - </span><span data-reactid="280">企业级 Node 开发框架</span></div><div data-reactid="281"><a target="_blank" rel="noopener noreferrer" href="https://antv.alipay.com/" data-reactid="282">AntV</a><span data-reactid="283"> - </span><span data-reactid="284">数据可视化</span></div><div data-reactid="285"><a target="_blank" rel="noopener noreferrer" href="http://motion.ant.design" data-reactid="286">Ant Motion</a><span data-reactid="287"> - </span><span data-reactid="288">设计动效</span></div><div data-reactid="289"><a target="_blank" rel="noopener noreferrer" href="http://library.ant.design/" data-reactid="290">AntD Library</a><span data-reactid="291"> - </span><span data-reactid="292">Axure 部件库</span></div><div data-reactid="293"><a target="_blank" rel="noopener noreferrer" href="http://ux.ant.design" data-reactid="294">Ant UX</a><span data-reactid="295"> - </span><span data-reactid="296">页面逻辑素材</span></div></li><li data-reactid="297"><h2 data-reactid="298"><i class="anticon anticon-customer-service" data-reactid="299"></i><!-- react-text: 300 --> <!-- /react-text --><span data-reactid="301">社区</span></h2><div data-reactid="302"><a href="/changelog" data-reactid="303"><span data-reactid="304">更新记录</span></a></div><div data-reactid="305"><a target="_blank" rel="noopener noreferrer" href="https://github.com/ant-design/ant-design/wiki/FAQ" data-reactid="306"><span data-reactid="307">常见问题</span></a></div><div data-reactid="308"><a target="_blank" rel="noopener noreferrer" href="https://gitter.im/ant-design/ant-design" data-reactid="309"><span data-reactid="310">在线讨论</span></a></div><div data-reactid="311"><a target="_blank" rel="noopener noreferrer" href="https://github.com/ant-design/ant-design/issues/new" data-reactid="312"><span data-reactid="313">报告 Bug</span></a></div><div data-reactid="314"><a target="_blank" rel="noopener noreferrer" href="http://stackoverflow.com/questions/tagged/antd" data-reactid="315"><span data-reactid="316">StackOverflow</span></a></div><div data-reactid="317"><a target="_blank" rel="noopener noreferrer" href="https://segmentfault.com/t/antd" data-reactid="318"><span data-reactid="319">SegmentFault</span></a></div></li><li data-reactid="320"><h2 data-reactid="321"><!-- react-text: 322 -->Copyright © <!-- /react-text --><!-- react-text: 323 -->2017<!-- /react-text --></h2><div data-reactid="324"><span data-reactid="325">蚂蚁金服体验技术部出品</span></div><div data-reactid="326"><!-- react-text: 327 -->Built with <!-- /react-text --><a target="_blank" rel="noopener noreferrer" href="https://github.com/benjycui/bisheng" data-reactid="328">BiSheng</a></div></li></ul></footer></div>
</div>
<script src="/common.js"></script>
<script src="/index.js"></script>
</body>
</html>