blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-05 19:41:42 +08:00
Code Issues Projects Releases Wiki Activity

chore(Tabbar): improve isUnfit (#8356)

Browse Source
This commit is contained in:
neverland 2021-03-15 20:35:14 +08:00 committed by GitHub
parent b119d4ad41
commit d9ed5b9fb0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 14 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/tabbar/README.md
View File

@ -171,9 +171,9 @@ export default {
### Tabbar Events
| Event | Description | Arguments |
| ------ | -------------------------------- | ---------------------------- |
| change | Emitted when changing active tab | active: index of current tab |
| Event | Description | Arguments |
| ------ | -------------------------------- | -------------------------- |
| change | Emitted when changing active tab | _active: number \| string_ |
### TabbarItem Props
@ -190,9 +190,9 @@ export default {
### TabbarItem Slots
| Name | Description | SlotProps |
| ---- | ----------- | --------- |
| icon | Custom icon | active |
| Name | Description | SlotProps |
| ---- | ----------- | -------------------------- |
| icon | Custom icon | _active: boolean_ |
### Less Variables

8
src/tabbar/README.zh-CN.md
View File

@ -115,6 +115,8 @@ export default {
### 自定义颜色
通过 `active-color` 属性设置选中标签的颜色，通过 `inactive-color` 属性设置未选中标签的颜色。
```html
<van-tabbar v-model="active" active-color="#ee0a24" inactive-color="#000">
<van-tabbar-item icon="home-o">标签</van-tabbar-item>
@ -126,6 +128,8 @@ export default {
### 监听切换事件
通过 `change` 事件来监听选中标签的变化。
```html
<van-tabbar v-model="active" @change="onChange">
<van-tabbar-item icon="home-o">标签 1</van-tabbar-item>
@ -185,7 +189,7 @@ export default {
| 事件名 | 说明 | 回调参数 |
| ------ | -------------- | ---------------------------------- |
| change | 切换标签时触发 | active: 当前选中标签的名称或索引值 |
| change | 切换标签时触发 | _active: number \| string_ |
### TabbarItem Props
@ -204,7 +208,7 @@ export default {
| 名称 | 说明 | 参数 |
| ---- | ---------- | ---------------------- |
| icon | 自定义图标 | active: 是否为选中标签 |
| icon | 自定义图标 | _active: boolean_ |
### 样式变量

9
src/tabbar/Tabbar.tsx
View File

@ -55,13 +55,8 @@ export default defineComponent({
const { linkChildren } = useChildren(TABBAR_KEY);
const renderPlaceholder = usePlaceholder(root, bem);
const isUnfit = () => {
if (props.safeAreaInsetBottom !== null) {
return !props.safeAreaInsetBottom;
}
// enable safe-area-inset-bottom by default when fixed
return !props.fixed;
};
// enable safe-area-inset-bottom by default when fixed
const isUnfit = () => !(props.safeAreaInsetBottom ?? props.fixed);
const renderTabbar = () => {
const { fixed, zIndex, border } = props;