blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

[improvement] Tab: use transform to improve animation performance

Browse Source
This commit is contained in:
陈嘉涵 2019-05-11 11:43:30 +08:00
parent 1158a31cb1
commit 2bf84cd790
3 changed files with 3 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
docs/markdown/v2-progress-tracking.md
View File

@ -134,6 +134,7 @@
### Tab ### Tab
- 优化`animated`动画性能
- 修复开启`animated`后高度错误的问题 - 修复开启`animated`后高度错误的问题
### Tabbar ### Tabbar

2
packages/tab/test/__snapshots__/demo.spec.js.snap
View File

@ -206,7 +206,7 @@ exports[`renders demo correctly 1`] = `
</div> </div>
</div> </div>
<div class="van-tabs__content"> <div class="van-tabs__content">
<div class="van-tabs__track" style="left: 0%; transition-duration: 0.3s;"> <div class="van-tabs__track" style="transform: translate3d(0%, 0, 0); transition-duration: 0.3s;">
<div class="van-tab__pane-wrapper"> <div class="van-tab__pane-wrapper">
<div class="van-tab__pane"> <div class="van-tab__pane">
内容 1 内容 1

2
packages/tabs/index.js
View File

@ -111,7 +111,7 @@ export default sfc({
trackStyle() { trackStyle() {
if (this.animated) { if (this.animated) {
return { return {
left: `${-1 * this.curActive * 100}%`, transform: `translate3d(${-1 * this.curActive * 100}%, 0, 0)`,
transitionDuration: `${this.duration}s` transitionDuration: `${this.duration}s`
}; };
} }