mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-24 10:20:19 +08:00
[Improvement] support Number type info (#845)
This commit is contained in:
parent
d3f6042650
commit
64898e1900
@ -47,5 +47,5 @@ export default {
|
|||||||
| Attribute | Description | Type | Default | Accepted Values |
|
| Attribute | Description | Type | Default | Accepted Values |
|
||||||
|-----------|-----------|-----------|-------------|-------------|
|
|-----------|-----------|-----------|-------------|-------------|
|
||||||
| title | Content | `String` | `''` | - |
|
| title | Content | `String` | `''` | - |
|
||||||
| info | Info Message | `String` | `''` | - |
|
| info | Info Message | `String | Number` | `''` | - |
|
||||||
| url | Link | `String` | - | - |
|
| url | Link | `String` | - | - |
|
||||||
|
@ -61,7 +61,7 @@ Use `info` prop to show messages in upper right corner of icon
|
|||||||
| text | Button text | `String` | - | - |
|
| text | Button text | `String` | - | - |
|
||||||
| icon | Icon | `String` | - | - |
|
| icon | Icon | `String` | - | - |
|
||||||
| icon-class | Icon class name | `String` | `''` | - |
|
| icon-class | Icon class name | `String` | `''` | - |
|
||||||
| info | Info message | `String` | - | - |
|
| info | Info message | `String | Number` | - | - |
|
||||||
| url | Link | `String` | - | - |
|
| url | Link | `String` | - | - |
|
||||||
| to | Target route of the link, same as to of `vue-router` | `String | Object` | - | - |
|
| to | Target route of the link, same as to of `vue-router` | `String | Object` | - | - |
|
||||||
| replace | If true, the navigation will not leave a history record | `String` | `false` | - |
|
| replace | If true, the navigation will not leave a history record | `String` | `false` | - |
|
||||||
|
@ -49,7 +49,7 @@ import 'vant/lib/vant-css/icon-local.css';
|
|||||||
| Attribute | Description | Type | Default | Accepted Values |
|
| Attribute | Description | Type | Default | Accepted Values |
|
||||||
|-----------|-----------|-----------|-------------|-------------|
|
|-----------|-----------|-----------|-------------|-------------|
|
||||||
| name | Icon name | `String` | `''` | - |
|
| name | Icon name | `String` | `''` | - |
|
||||||
| info | Info message | `String` | `''` | - |
|
| info | Info message | `String | Number` | `''` | - |
|
||||||
|
|
||||||
### Event
|
### Event
|
||||||
|
|
||||||
|
@ -78,7 +78,7 @@ export default {
|
|||||||
|-----------|-----------|-----------|-------------|-------------|
|
|-----------|-----------|-----------|-------------|-------------|
|
||||||
| icon | Icon name | `String` | - | Names from Icon Component |
|
| icon | Icon name | `String` | - | Names from Icon Component |
|
||||||
| dot | Whether to show red dot | `Boolean` | - | - |
|
| dot | Whether to show red dot | `Boolean` | - | - |
|
||||||
| info | Info message | `String` | - | - |
|
| info | Info message | `String | Number` | - | - |
|
||||||
| url | Link | `String` | - | - |
|
| url | Link | `String` | - | - |
|
||||||
| to | Target route of the link, same as to of `vue-router` | `String | Object` | - | - |
|
| to | Target route of the link, same as to of `vue-router` | `String | Object` | - | - |
|
||||||
| replace | If true, the navigation will not leave a history record | `String` | `false` | - |
|
| replace | If true, the navigation will not leave a history record | `String` | `false` | - |
|
||||||
|
@ -48,5 +48,5 @@ export default {
|
|||||||
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|
||||||
|-----------|-----------|-----------|-------------|-------------|
|
|-----------|-----------|-----------|-------------|-------------|
|
||||||
| title | 内容 | `String` | `''` | - |
|
| title | 内容 | `String` | `''` | - |
|
||||||
| info | 提示消息 | `String` | `''` | - |
|
| info | 提示消息 | `String | Number` | `''` | - |
|
||||||
| url | 跳转链接 | `String` | - | - |
|
| url | 跳转链接 | `String` | - | - |
|
||||||
|
@ -61,7 +61,7 @@ export default {
|
|||||||
| text | 按钮文字 | `String` | - | - |
|
| text | 按钮文字 | `String` | - | - |
|
||||||
| icon | 图标 | `String` | - | Icon 组件支持的所有图标 |
|
| icon | 图标 | `String` | - | Icon 组件支持的所有图标 |
|
||||||
| icon-class | 图标额外类名 | `String` | `''` | - |
|
| icon-class | 图标额外类名 | `String` | `''` | - |
|
||||||
| info | 图标右上角提示信息 | `String` | - | - |
|
| info | 图标右上角提示信息 | `String | Number` | - | - |
|
||||||
| url | 跳转链接 | `String` | - | - |
|
| url | 跳转链接 | `String` | - | - |
|
||||||
| to | 路由跳转对象,同 `vue-router` 的 to | `String | Object` | - | - |
|
| to | 路由跳转对象,同 `vue-router` 的 to | `String | Object` | - | - |
|
||||||
| replace | 跳转时是否替换当前 history | `String` | `false` | - |
|
| replace | 跳转时是否替换当前 history | `String` | `false` | - |
|
||||||
|
@ -50,7 +50,7 @@ import 'vant/lib/vant-css/icon-local.css';
|
|||||||
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|
||||||
|-----------|-----------|-----------|-------------|-------------|
|
|-----------|-----------|-----------|-------------|-------------|
|
||||||
| name | 图标名称 | `String` | `''` | - |
|
| name | 图标名称 | `String` | `''` | - |
|
||||||
| info | 图标右上角文字提示 | `String` | `''` | - |
|
| info | 图标右上角文字提示 | `String | Number` | `''` | - |
|
||||||
|
|
||||||
### Event
|
### Event
|
||||||
|
|
||||||
|
@ -82,7 +82,7 @@ export default {
|
|||||||
|-----------|-----------|-----------|-------------|-------------|
|
|-----------|-----------|-----------|-------------|-------------|
|
||||||
| icon | 图标名称 | `String` | - | Icon 组件中可用的类型 |
|
| icon | 图标名称 | `String` | - | Icon 组件中可用的类型 |
|
||||||
| dot | 是否显示小红点 | `Boolean` | - | - |
|
| dot | 是否显示小红点 | `Boolean` | - | - |
|
||||||
| info | 图标右上角提示信息 | `String` | - | - |
|
| info | 图标右上角提示信息 | `String | Number` | - | - |
|
||||||
| url | 跳转链接 | `String` | - | - |
|
| url | 跳转链接 | `String` | - | - |
|
||||||
| to | 路由跳转对象,同 `vue-router` 的 to | `String | Object` | - | - |
|
| to | 路由跳转对象,同 `vue-router` 的 to | `String | Object` | - | - |
|
||||||
| replace | 跳转时是否替换当前 history | `String` | `false` | - |
|
| replace | 跳转时是否替换当前 history | `String` | `false` | - |
|
||||||
|
@ -1,19 +1,20 @@
|
|||||||
<template>
|
<template>
|
||||||
<a class="van-badge van-hairline" :class="{ 'van-badge--select': isSelect }" :href="url" @click="onClick">
|
<a class="van-badge van-hairline" :class="{ 'van-badge--select': isSelect }" :href="url" @click="onClick">
|
||||||
<div v-if="info" class="van-badge__info">{{ info }}</div>
|
<div v-if="isDef(info)" class="van-badge__info">{{ info }}</div>
|
||||||
{{ title }}
|
{{ title }}
|
||||||
</a>
|
</a>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import create from '../utils/create';
|
import create from '../utils/create';
|
||||||
|
import { isDef } from '../utils';
|
||||||
|
|
||||||
export default create({
|
export default create({
|
||||||
name: 'badge',
|
name: 'badge',
|
||||||
|
|
||||||
props: {
|
props: {
|
||||||
url: String,
|
url: String,
|
||||||
info: String,
|
info: [String, Number],
|
||||||
title: String
|
title: String
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -28,6 +29,8 @@ export default create({
|
|||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
|
isDef,
|
||||||
|
|
||||||
onClick() {
|
onClick() {
|
||||||
this.$emit('click', this.$parent.badges.indexOf(this));
|
this.$emit('click', this.$parent.badges.indexOf(this));
|
||||||
}
|
}
|
||||||
|
@ -17,7 +17,7 @@ export default create({
|
|||||||
props: {
|
props: {
|
||||||
url: String,
|
url: String,
|
||||||
text: String,
|
text: String,
|
||||||
info: String,
|
info: [String, Number],
|
||||||
icon: String,
|
icon: String,
|
||||||
iconClass: String
|
iconClass: String
|
||||||
},
|
},
|
||||||
|
@ -1,11 +1,12 @@
|
|||||||
<template>
|
<template>
|
||||||
<i class="van-icon" :class="`van-icon-${name}`" v-on="$listeners">
|
<i class="van-icon" :class="`van-icon-${name}`" v-on="$listeners">
|
||||||
<slot />
|
<slot />
|
||||||
<div v-if="info" class="van-icon__info">{{ info }}</div>
|
<div v-if="isDef(info)" class="van-icon__info">{{ info }}</div>
|
||||||
</i>
|
</i>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import { isDef } from '../utils';
|
||||||
import create from '../utils/create-basic';
|
import create from '../utils/create-basic';
|
||||||
|
|
||||||
export default create({
|
export default create({
|
||||||
@ -13,7 +14,11 @@ export default create({
|
|||||||
|
|
||||||
props: {
|
props: {
|
||||||
name: String,
|
name: String,
|
||||||
info: String
|
info: [String, Number]
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
isDef
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
@ -4,7 +4,7 @@
|
|||||||
<slot name="icon" :active="active">
|
<slot name="icon" :active="active">
|
||||||
<icon v-if="icon" :name="icon" />
|
<icon v-if="icon" :name="icon" />
|
||||||
</slot>
|
</slot>
|
||||||
<div v-if="info" class="van-icon__info">{{ info }}</div>
|
<div v-if="isDef(info)" class="van-icon__info">{{ info }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="van-tabbar-item__text">
|
<div class="van-tabbar-item__text">
|
||||||
<slot :active="active"/>
|
<slot :active="active"/>
|
||||||
@ -13,6 +13,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import { isDef } from '../utils';
|
||||||
import create from '../utils/create';
|
import create from '../utils/create';
|
||||||
import RouterLink from '../mixins/router-link';
|
import RouterLink from '../mixins/router-link';
|
||||||
|
|
||||||
@ -24,7 +25,7 @@ export default create({
|
|||||||
props: {
|
props: {
|
||||||
icon: String,
|
icon: String,
|
||||||
dot: Boolean,
|
dot: Boolean,
|
||||||
info: String
|
info: [String, Number]
|
||||||
},
|
},
|
||||||
|
|
||||||
data() {
|
data() {
|
||||||
@ -42,6 +43,8 @@ export default create({
|
|||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
|
isDef,
|
||||||
|
|
||||||
onClick(event) {
|
onClick(event) {
|
||||||
this.$parent.onChange(this.$parent.items.indexOf(this));
|
this.$parent.onChange(this.$parent.items.indexOf(this));
|
||||||
this.$emit('click', event);
|
this.$emit('click', event);
|
||||||
|
Loading…
x
Reference in New Issue
Block a user