home/ant-design
2
0
Fork 0
mirror of https://github.com/wahyd4/ant-design.git synced 2026-08-15 07:46:41 +10:00
Code Issues Packages Projects Releases Wiki Activity
Files
ea2107de0fbac43274956fe587835817912ce2cb
ant-design/docs/react/upgrade-notes.html
T
afc163 ea2107de0f Updates
2016-03-16 22:07:28 +08:00

697 lines
30 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
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="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<meta name="description" content="一个 UI 设计语言"/>
<title>
升级指南 - Ant Design
</title>
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="../../dist/demo.css?20160114">
<script src="https://as.alipayobjects.com/g/component/??console-polyfill/0.2.2/index.js,es5-shim/4.5.7/es5-shim.min.js,es5-shim/4.5.7/es5-sham.min.js,html5shiv/3.7.2/html5shiv.min.js,media-match/2.0.2/media.match.min.js,jquery/1.11.3/jquery.min.js,bluebird/3.1.1/bluebird.min.js"></script>
<script>
(function() {
window.ANT_COMPONENTS = [];
window.InstantClickChangeFns = [];
ANT_COMPONENTS.push({
title: 'Pagination',
desc: '分页'
});
ANT_COMPONENTS.push({
title: 'Affix',
desc: '固钉'
});
ANT_COMPONENTS.push({
title: 'Badge',
desc: '徽标数'
});
ANT_COMPONENTS.push({
title: 'Breadcrumb',
desc: '面包屑'
});
ANT_COMPONENTS.push({
title: 'Button',
desc: '按钮'
});
ANT_COMPONENTS.push({
title: 'Calendar',
desc: '日历'
});
ANT_COMPONENTS.push({
title: 'Carousel',
desc: '走马灯'
});
ANT_COMPONENTS.push({
title: 'Cascader',
desc: '级联选择'
});
ANT_COMPONENTS.push({
title: 'Checkbox',
desc: '多选框'
});
ANT_COMPONENTS.push({
title: 'Collapse',
desc: '折叠面板'
});
ANT_COMPONENTS.push({
title: 'DatePicker',
desc: '日期选择框'
});
ANT_COMPONENTS.push({
title: 'Dropdown',
desc: '下拉菜单'
});
ANT_COMPONENTS.push({
title: 'Form',
desc: '表单'
});
ANT_COMPONENTS.push({
title: 'Icon',
desc: '图标'
});
ANT_COMPONENTS.push({
title: 'InputNumber',
desc: '数字输入框'
});
ANT_COMPONENTS.push({
title: 'Layout',
desc: '布局'
});
ANT_COMPONENTS.push({
title: 'Menu',
desc: '导航菜单'
});
ANT_COMPONENTS.push({
title: 'Message',
desc: '全局提示'
});
ANT_COMPONENTS.push({
title: 'Modal',
desc: '对话框'
});
ANT_COMPONENTS.push({
title: 'Notification',
desc: '通知提醒框'
});
ANT_COMPONENTS.push({
title: 'Alert',
desc: '警告提示'
});
ANT_COMPONENTS.push({
title: 'Popconfirm',
desc: '气泡确认框'
});
ANT_COMPONENTS.push({
title: 'Popover',
desc: '气泡卡片'
});
ANT_COMPONENTS.push({
title: 'Progress',
desc: '进度条'
});
ANT_COMPONENTS.push({
title: 'QueueAnim',
desc: '进出场动画'
});
ANT_COMPONENTS.push({
title: 'Radio',
desc: '单选框'
});
ANT_COMPONENTS.push({
title: 'Select',
desc: '选择器'
});
ANT_COMPONENTS.push({
title: 'Slider',
desc: '滑动输入条'
});
ANT_COMPONENTS.push({
title: 'Spin',
desc: '加载中'
});
ANT_COMPONENTS.push({
title: 'Steps',
desc: '步骤条'
});
ANT_COMPONENTS.push({
title: 'Switch',
desc: '开关'
});
ANT_COMPONENTS.push({
title: 'Table',
desc: '表格'
});
ANT_COMPONENTS.push({
title: 'Tabs',
desc: '标签页'
});
ANT_COMPONENTS.push({
title: 'Tag',
desc: '标签'
});
ANT_COMPONENTS.push({
title: 'TimePicker',
desc: '时间选择框'
});
ANT_COMPONENTS.push({
title: 'Timeline',
desc: '时间轴'
});
ANT_COMPONENTS.push({
title: 'Tooltip',
desc: '文字提示'
});
ANT_COMPONENTS.push({
title: 'Transfer',
desc: '穿梭框'
});
ANT_COMPONENTS.push({
title: 'Tree',
desc: '树形控件'
});
ANT_COMPONENTS.push({
title: 'TreeSelect',
desc: '树选择'
});
ANT_COMPONENTS.push({
title: 'Upload',
desc: '上传'
});
// fix ie location origin
// http://stackoverflow.com/questions/22564167/window-location-origin-gives-wrong-value-when-using-ie
if (!window.location.origin) {
window.location.origin = window.location.protocol + "//"
+ window.location.hostname
+ (window.location.port ? ':' + window.location.port : '');
}
var i = location.pathname.split('/').lastIndexOf('ant-design');
if (i > 0) {
window.rootUrl = location.origin + location.pathname.split('/').slice(0, 2+1).join('/');
} else {
window.rootUrl = location.origin;
}
})();
</script>
<script>
window.antdVersion = {
latest: '0.12.11'
};
</script>
<script src="../../dist/demo.js?20160114"></script>
</head>
<body >
<header id="header" class="clearfix">
<a class="logo" href="../..">
<img width="60" src="https://t.alipayobjects.com/images/rmsweb/T1B9hfXcdvXXXXXXXX.svg">
Ant Design
</a>
<div class="search">
<div id="autoComplete"></div>
</div>
<nav class="nav" tabindex="-1">
<span class="bar"></span>
<ul>
<li class="">
<a href="../..">首页</a>
</li>
<li class="">
<a href="../practice/cases">实践</a>
</li>
<li class="">
<a href="../pattern/navigation">模式</a>
</li>
<li class="current">
<a href="./introduce">组件</a>
</li>
<li class="">
<a href="../spec/introduce">语言</a>
</li>
<li class="">
<a href="../resource/download">资源</a>
</li>
</ul>
</nav>
<div class="nav-phone-icon"></div>
</header>
<div class="main-wrapper">
<aside class="aside-container">
<ul>
<li class="">
<a href="introduce"
class="">
Ant Design of React
<span class="chinese"></span>
</a>
</li>
<li class="">
<a href="getting-started"
class="">
快速上手
<span class="chinese"></span>
</a>
</li>
<li class="">
<a href="install"
class="">
安装
<span class="chinese"></span>
</a>
</li>
<li class="current">
<a href="upgrade-notes"
class="">
升级指南
<span class="chinese"></span>
</a>
</li>
<li class="">
<a href="../../changelog"
class="">
更新日志
<span class="chinese"></span>
</a>
</li>
<li open="open">
<h4>Components</h4>
<ul class="">
<li class="type-divider">基本</li>
<li class="">
<a href="../../components/button/"
class="">
Button
<span class="chinese">按钮</span>
</a>
</li>
<li class="">
<a href="../../components/icon/"
class="">
Icon
<span class="chinese">图标</span>
</a>
</li>
<li class="">
<a href="../../components/layout/"
class="">
Layout
<span class="chinese">布局</span>
</a>
</li>
<li class="type-divider">表单</li>
<li class="">
<a href="../../components/cascader/"
class="">
Cascader
<span class="chinese">级联选择</span>
</a>
</li>
<li class="">
<a href="../../components/checkbox/"
class="">
Checkbox
<span class="chinese">多选框</span>
</a>
</li>
<li class="">
<a href="../../components/date-picker/"
class="">
DatePicker
<span class="chinese">日期选择框</span>
</a>
</li>
<li class="">
<a href="../../components/form/"
class="">
Form
<span class="chinese">表单</span>
</a>
</li>
<li class="">
<a href="../../components/input-number/"
class="">
InputNumber
<span class="chinese">数字输入框</span>
</a>
</li>
<li class="">
<a href="../../components/radio/"
class="">
Radio
<span class="chinese">单选框</span>
</a>
</li>
<li class="">
<a href="../../components/select/"
class="">
Select
<span class="chinese">选择器</span>
</a>
</li>
<li class="">
<a href="../../components/slider/"
class="">
Slider
<span class="chinese">滑动输入条</span>
</a>
</li>
<li class="">
<a href="../../components/switch/"
class="">
Switch
<span class="chinese">开关</span>
</a>
</li>
<li class="">
<a href="../../components/time-picker/"
class="">
TimePicker
<span class="chinese">时间选择框</span>
</a>
</li>
<li class="">
<a href="../../components/transfer/"
class="">
Transfer
<span class="chinese">穿梭框</span>
</a>
</li>
<li class="">
<a href="../../components/tree-select/"
class="">
TreeSelect
<span class="chinese">树选择</span>
</a>
</li>
<li class="">
<a href="../../components/upload/"
class="">
Upload
<span class="chinese">上传</span>
</a>
</li>
<li class="type-divider">展示</li>
<li class="">
<a href="../../components/alert/"
class="">
Alert
<span class="chinese">警告提示</span>
</a>
</li>
<li class="">
<a href="../../components/badge/"
class="">
Badge
<span class="chinese">徽标数</span>
</a>
</li>
<li class="">
<a href="../../components/calendar/"
class="">
Calendar
<span class="chinese">日历</span>
</a>
</li>
<li class="">
<a href="../../components/carousel/"
class="">
Carousel
<span class="chinese">走马灯</span>
</a>
</li>
<li class="">
<a href="../../components/collapse/"
class="">
Collapse
<span class="chinese">折叠面板</span>
</a>
</li>
<li class="">
<a href="../../components/dropdown/"
class="">
Dropdown
<span class="chinese">下拉菜单</span>
</a>
</li>
<li class="">
<a href="../../components/message/"
class=""data-no-instant>
Message
<span class="chinese">全局提示</span>
</a>
</li>
<li class="">
<a href="../../components/modal/"
class="">
Modal
<span class="chinese">对话框</span>
</a>
</li>
<li class="">
<a href="../../components/notification/"
class=""data-no-instant>
Notification
<span class="chinese">通知提醒框</span>
</a>
</li>
<li class="">
<a href="../../components/popconfirm/"
class="">
Popconfirm
<span class="chinese">气泡确认框</span>
</a>
</li>
<li class="">
<a href="../../components/popover/"
class="">
Popover
<span class="chinese">气泡卡片</span>
</a>
</li>
<li class="">
<a href="../../components/progress/"
class="">
Progress
<span class="chinese">进度条</span>
</a>
</li>
<li class="">
<a href="../../components/table/"
class="">
Table
<span class="chinese">表格</span>
</a>
</li>
<li class="">
<a href="../../components/tag/"
class="">
Tag
<span class="chinese">标签</span>
</a>
</li>
<li class="">
<a href="../../components/timeline/"
class="">
Timeline
<span class="chinese">时间轴</span>
</a>
</li>
<li class="">
<a href="../../components/tooltip/"
class="">
Tooltip
<span class="chinese">文字提示</span>
</a>
</li>
<li class="">
<a href="../../components/tree/"
class="">
Tree
<span class="chinese">树形控件</span>
</a>
</li>
<li class="type-divider">导航</li>
<li class="">
<a href="../../components/breadcrumb/"
class="">
Breadcrumb
<span class="chinese">面包屑</span>
</a>
</li>
<li class="">
<a href="../../components/menu/"
class="">
Menu
<span class="chinese">导航菜单</span>
</a>
</li>
<li class="">
<a href="../../components/pagination/"
class="">
Pagination
<span class="chinese">分页</span>
</a>
</li>
<li class="">
<a href="../../components/steps/"
class="">
Steps
<span class="chinese">步骤条</span>
</a>
</li>
<li class="">
<a href="../../components/tabs/"
class="">
Tabs
<span class="chinese">标签页</span>
</a>
</li>
<li class="type-divider">其他</li>
<li class="">
<a href="../../components/affix/"
class="">
Affix
<span class="chinese">固钉</span>
</a>
</li>
<li class="">
<a href="../../components/queue-anim/"
class="">
QueueAnim
<span class="chinese">进出场动画</span>
</a>
</li>
<li class="">
<a href="../../components/spin/"
class="">
Spin
<span class="chinese">加载中</span>
</a>
</li>
</ul>
</li>
</ul>
</aside>
<section class="main-container">
<article class="markdown">
<h1>升级指南 <span class="subtitle"></span></h1>
<div class="toc"><ul><li><a href="#0-11-gt-0-12">0.11 =&gt; 0.12</a><ul><li><a href="#使用-form-提供的校验功能代替-validation">使用 Form 提供的校验功能代替 Validation</a></li><li><a href="#progress-format-属性的值改为函数">Progress <code>format</code> 属性的值改为函数</a></li><li><a href="#tree">Tree</a></li></ul></li><li><a href="#0-10-gt-0-11">0.10 =&gt; 0.11</a><ul><li><a href="#默认加载样式">默认加载样式</a></li><li><a href="#表格远程模式">表格远程模式</a></li><li><a href="#timepicker、datepicker-重命名">Timepicker、Datepicker 重命名</a></li><li><a href="#受控的-datepicker">受控的 DatePicker</a></li><li><a href="#其他">其他</a></li></ul></li><li><a href="#0-9-gt-0-10">0.9 =&gt; 0.10</a><ul><li><a href="#升级-react">升级 React</a></li><li><a href="#组件化改造">组件化改造</a></li><li><a href="#size-属性统一">size 属性统一</a></li><li><a href="#其他">其他</a></li></ul></ul></div>
<p>这里只列出升级中的不兼容改动，其他改动见 <a href="/changelog">Changelog</a>。</p>
<h2 id="0-11-gt-0-12">0.11 =&gt; 0.12<a href="#0-11-gt-0-12" class="anchor">#</a> </h2><hr>
<h3 id="使用-form-提供的校验功能代替-validation">使用 Form 提供的校验功能代替 Validation<a href="#使用-form-提供的校验功能代替-validation" class="anchor">#</a> </h3><p>Validation 已经被废弃，并会在以后的版本完全移除，所以建议尽快使用 Form 自带的校验功能替换 Validation。具体使用方式可以查阅文档和例子（<a href="http://ant.design/components/form/#demo-validate-basic">#1</a> <a href="http://ant.design/components/form/#demo-validate-other">#2</a> <a href="http://ant.design/components/form/#demo-validate-customized">#3</a>）。</p>
<h3 id="progress-format-属性的值改为函数">Progress <code>format</code> 属性的值改为函数<a href="#progress-format-属性的值改为函数" class="anchor">#</a> </h3><p>把使用了 <code>format</code> 属性的代码，如：</p>
<div class="highlight"><pre><code class="javascript">&lt;Progress.Circle percent={<span class="hljs-number">100</span>} format={<span class="xml"><span class="hljs-tag">&lt;<span class="hljs-title">Icon</span> <span class="hljs-attribute">type</span>=<span class="hljs-value">"check"</span> /&gt;</span>} /&gt;</span></code></pre></div><p>改为：</p>
<div class="highlight"><pre><code class="javascript">&lt;Progress.Circle percent={<span class="hljs-number">100</span>} format={() =&gt; <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-title">Icon</span> <span class="hljs-attribute">type</span>=<span class="hljs-value">"check"</span> /&gt;</span>} /&gt;</span></code></pre></div><h3 id="tree">Tree<a href="#tree" class="anchor">#</a> </h3><ul>
<li><code>onSelect</code> 回调函数，由原来的<code>一个</code>参数，变为<code>两个</code>，第一个为<code>selectedKeys</code>，第二个参数为原来第一个参数里的其余信息。另外<code>selectedKeys</code>里包含了当前选中的节点key，而原来的不包含。</li>
<li><code>onCheck</code> 回调函数，由原来的<code>一个</code>参数，变为<code>两个</code>，第一个为<code>checkedKeys</code>，第二个参数为原来第一个参数里的其余信息。另外<code>checkedKeys</code>里包含了当前选中的节点key，而原来的不包含（这样免去业务里自己组装key的工作）。</li>
<li>异步API中<code>onDataLoaded</code>重命名为<code>loadData</code>，其他不用改。</li>
</ul>
<h2 id="0-10-gt-0-11">0.10 =&gt; 0.11<a href="#0-10-gt-0-11" class="anchor">#</a> </h2><hr>
<p><code>0.11.x</code> 版本有大量更新，其中部分为不兼容更新。以下列表为其中不兼容的更新及对应升级方案。如果您在升级过程中遇到下面没有提到的情况，可以到 Github 上面咨询。</p>
<ul>
<li><code>0.11.x</code> 文档：<a href="http://ant.design">http://ant.design</a></li>
<li><code>0.10.x</code> 文档：<a href="http://010x.ant.design">http://010x.ant.design</a></li>
</ul>
<h3 id="默认加载样式">默认加载样式<a href="#默认加载样式" class="anchor">#</a> </h3><p>样式现在不再会在 <code>antd</code> 中默认加载，如果升级后没有样式，开发者需要手动自行引入样式。</p>
<div class="highlight"><pre><code class="javascript"><span class="hljs-keyword">import</span> <span class="hljs-string">'antd/lib/index.css'</span>;
<span class="hljs-comment">// 或者</span>
<span class="hljs-keyword">import</span> <span class="hljs-string">'antd/style/index.less'</span>;</code></pre></div><h3 id="表格远程模式">表格远程模式<a href="#表格远程模式" class="anchor">#</a> </h3><p><code>Table</code> 的 <code>dataSource</code> 远程模式被移除，用户需要自行实现数据获取方式，ajax 获取数据的演示可以参见 <a href="http://ant.design/components/table/#demo-ajax">演示</a>。</p>
<h3 id="timepicker、datepicker-重命名">Timepicker、Datepicker 重命名<a href="#timepicker、datepicker-重命名" class="anchor">#</a> </h3><p><code>Timepicker</code> 被重命名为 <code>TimePicker</code>，<code>Datepicker</code> 被重命名为 <code>DatePicker</code>，需要做以下改动：</p>
<div class="highlight"><pre><code class="javascript">&lt;Timepicker /&gt; ==&gt; <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-title">TimePicker</span> /&gt;</span></span></code></pre></div><div class="highlight"><pre><code class="javascript">&lt;Datepicker /&gt; ==&gt; <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-title">DatePicker</span> /&gt;</span></span></code></pre></div><p>相应的，两个组件的文档地址也改为 <a href="/components/date-picker">/components/date-picker</a> 和 <a href="/components/time-picker">/components/time-picker</a>。</p>
<h3 id="受控的-datepicker">受控的 DatePicker<a href="#受控的-datepicker" class="anchor">#</a> </h3><p>由于 <code>DatePicker</code> 已改为 <a href="https://facebook.github.io/react/docs/forms.html#controlled-components">受控组件</a>，所以 <code>DatePicker</code> 显示的值必然与其 <code>value</code> 一致。</p>
<p>如果无法理解受控组件，只须在发现在选中日期后 <code>Datepicker</code> 显示的值不变的情况后，把其 <code>value</code> 属性改为 <code>defaultValue</code> 即可。</p>
<h3 id="其他">其他<a href="#其他" class="anchor">#</a> </h3><ul>
<li>Alert 组件默认不展示样式，可以用 <code>showIcon</code> 属性添加图标。</li>
<li>在 <code>0.10.x</code> 中 Datepicker 已废弃的 <code>onSelect</code> 属性被删除，请使用 <code>onChange</code> 属性。。</li>
<li>TimePicker 的 <code>hourOptions</code> <code>minuteOptions</code> <code>secondOptions</code> 属性已移除，可使用 <code>disabledHours</code> <code>disabledMinutes</code> <code>disabledSeconds</code> 配和 <code>hideDisabled</code> 属性来完成原有功能。<a href="http://ant.design/components/time-picker/#picker-demo-disable-options">演示</a></li>
</ul>
<h2 id="0-9-gt-0-10">0.9 =&gt; 0.10<a href="#0-9-gt-0-10" class="anchor">#</a> </h2><hr>
<p><code>0.10.x</code> 版本有大量改动，是一个不完全向下兼容的版本。以下文档尽力列出了 <code>0.9.x</code> 到 <code>0.10.x</code> 的不兼容变动，以帮助开发者升级。</p>
<ul>
<li><code>0.10.x</code> 文档：<a href="http://010x.ant.design">http://010x.ant.design</a></li>
<li><code>0.9.x</code> 文档：<a href="http://09x.ant.design">http://09x.ant.design</a></li>
</ul>
<h3 id="升级-react">升级 React<a href="#升级-react" class="anchor">#</a> </h3><p>新版本推荐使用 react@0.14.x 及以上版本，并增加了对低版本 react 的警告。建议进行同步升级，参考官方的<a href="http://facebook.github.io/react/blog/2015/10/07/react-v0.14.html">升级文档</a>。</p>
<h3 id="组件化改造">组件化改造<a href="#组件化改造" class="anchor">#</a> </h3><p>此版本对 <a href="/components/button/">Button</a>、<a href="/components/icon/">Iconfont</a>、<a href="/components/layout/">Layout</a>、<a href="/components/form/">Form</a>、<a href="/components/form/#demo-input">Input</a> 模块进行了 React 组件化的改造，请基于新的使用方式修改，原有的书写方式理论上无影响。</p>
<p>例如：</p>
<div class="highlight"><pre><code class="xml"><span class="hljs-tag">&lt;<span class="hljs-title">button</span> <span class="hljs-attribute">className</span>=<span class="hljs-value">"ant-btn ant-btn-primary"</span>&gt;</span>按 钮<span class="hljs-tag">&lt;/<span class="hljs-title">button</span>&gt;</span>
==&gt;
<span class="hljs-tag">&lt;<span class="hljs-title">Button</span> <span class="hljs-attribute">type</span>=<span class="hljs-value">"primary"</span>&gt;</span>按钮<span class="hljs-tag">&lt;/<span class="hljs-title">Button</span>&gt;</span></code></pre></div><div class="highlight"><pre><code class="xml"><span class="hljs-tag">&lt;<span class="hljs-title">i</span> <span class="hljs-attribute">className</span>=<span class="hljs-value">"anticon anticon-appstore"</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-title">i</span>&gt;</span>
==&gt;
<span class="hljs-tag">&lt;<span class="hljs-title">Icon</span> <span class="hljs-attribute">type</span>=<span class="hljs-value">"appstore"</span> /&gt;</span></code></pre></div><h3 id="size-属性统一">size 属性统一<a href="#size-属性统一" class="anchor">#</a> </h3><p>原有组件的 <code>size</code> 属性统一为大中小：<code>large</code> <code>default</code> <code>small</code>，包括 <code>Button</code> <code>Table</code> <code>Tabs</code> <code>Steps</code> <code>Select</code> <code>Pagination</code> <code>InputNumber</code> <code>Datepicker</code>。</p>
<p>例如：</p>
<div class="highlight"><pre><code class="xml"><span class="hljs-tag">&lt;<span class="hljs-title">Tabs</span> <span class="hljs-attribute">size</span>=<span class="hljs-value">"mini"</span>&gt;</span> ... <span class="hljs-tag">&lt;/<span class="hljs-title">Tabs</span>&gt;</span>
==&gt;
<span class="hljs-tag">&lt;<span class="hljs-title">Tabs</span> <span class="hljs-attribute">size</span>=<span class="hljs-value">"small"</span>&gt;</span> ... <span class="hljs-tag">&lt;/<span class="hljs-title">Tabs</span>&gt;</span></code></pre></div><p>详情可参考：<a href="https://github.com/ant-design/ant-design/issues/415">https://github.com/ant-design/ant-design/issues/415</a></p>
<h3 id="其他">其他<a href="#其他" class="anchor">#</a> </h3><ul>
<li><a href="http://09x.ant.design/components/enter-animation">enter-animation</a> 组件下线， 请使用 <a href="/components/queue-anim">queue-anim</a> 来代替。</li>
<li>Carousel 升级依赖，参考新的<a href="/components/carousel/">新的 API 和使用方式</a>进行修改。</li>
<li><code>antd.Notification()</code> 修改为小写的 <code>antd.notification()</code>。</li>
<li>Datepicker 的 <code>onSelect</code> 属性修改为 <code>onChange</code> 属性。</li>
<li>Datepicker 的 <code>calendarStyle</code> 属性修改为 <code>popupStyle</code> 属性。</li>
<li>Dropdown 的 <code>onSelect</code> 属性应修正为 <code>onClick</code> 属性，因为原有的 onSelect 只在变化时触发。</li>
<li>Slider 的 <code>withDots</code> <code>isIncluded</code> 属性修改为 <code>dots</code> <code>included</code>。</li>
<li>iconfont 的基线更新，可能导致原有图标的位置偏移。</li>
</ul>
<p>新版本变化较大，以上升级指南可能有遗漏，全部改动可以参考 <a href="/changelog">Changelog</a>。在升级过程中遇到问题，欢迎 <a href="https://github.com/ant-design/ant-design/issues/new">报告</a> 给我们。</p>
</article>
</section>
</div><footer id="footer">
<ul>
<li>
<h2>GitHub</h2>
<a target="_blank "href="https://github.com/ant-design/ant-design">仓库</a>
<a target="_blank" href="https://github.com/ant-design/antd-init">脚手架</a>
<a target="_blank" href="http://ant-tool.github.io/">开发工具</a>
</li>
<li>
<h2>关于我们</h2>
<a target="_blank" href="https://github.com/ant-ued/blog">博客 - Ant UED</a>
</li>
<li>
<h2>联系我们</h2>
<a target="_blank" href="https://github.com/ant-design/ant-design/issues">反馈和建议</a>
<a target="_blank" href="https://gitter.im/ant-design/ant-design">讨论</a>
<a target="_blank" href="http://dwz.cn/2AF9ao">报告 Bug</a>
</li>
<li>
<div>©2015 蚂蚁金服体验技术部出品</div>
<div>文档版本：<span id="versions-select"></span></div>
</li>
</ul>
</footer>
<script data-no-instant>
if (!location.port) {
(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');
InstantClick.on('change', function() {
ga('send', 'pageview', location.pathname + location.search);
});
}
</script>
<script data-no-instant>
InstantClick.on('change', function() {
InstantClickChangeFns.forEach(function(fn) {
fn();
});
});
InstantClick.init();
</script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink