mirror of
https://github.com/youzan/vant.git
synced 2025-10-18 17:51:54 +00:00
2.2 KiB
2.2 KiB
<script>
import Vue from 'vue';
const icons = [
'close',
'location',
'clock',
'gold-coin',
'chat',
'exchange',
'upgrade',
'edit',
'contact',
'passed',
'points',
'delete',
'records',
'logistics',
'check',
'checked',
'gift',
'like-o',
'like',
'qr',
'qr-invalid',
'shop',
'photograph',
'add',
'add2',
'photo',
'cart',
'arrow',
'search',
'clear',
'success',
'fail',
'wechat',
'alipay',
'password-view',
'wap-nav',
'password-not-view',
'wap-home',
'ecard-pay',
'balance-pay',
'peer-pay',
'credit-pay',
'debit-pay',
'other-pay',
'shopping-cart',
'browsing-history',
'goods-collect',
'shop-collect',
'receive-gift',
'send-gift',
'setting',
'coupon',
'free-postage',
'discount',
'birthday-privilege',
'member-day-privilege',
'balance-details',
'cash-back-record',
'points-mall',
'exchange-record',
'pending-payment',
'pending-orders',
'pending-deliver',
'pending-evaluate',
'cash-on-deliver',
'gift-card-pay',
'underway',
'point-gift',
'after-sale',
'edit-data',
'question',
'description',
'card',
'gift-card',
'coupon',
'completed',
'value-card',
'certificate',
'tosend',
'sign',
'home',
'phone'
];
const IconListConstructor = Vue.extend({
render(h) {
return (
{icons.map(icon => (
{icon}
))}
)
}
});
export default {
mounted() {
const IconList = new IconListConstructor({
el: document.createElement('div')
});
const block = document.querySelector('.zan-doc-demo-block');
if (block) {
block.appendChild(IconList.$el);
}
}
};
</script>
Icon
Install
import { Icon } from 'vant';
Vue.component(Icon.name, Icon);
Usage
Basic Usage
View all usable icons on the right.
:::demo Icon List
<van-icon name="success" />
:::
API
| Attribute | Description | Type | Default | Accepted Values |
|---|---|---|---|---|
| name | Icon name | String |
'' |
- |