wangfukang
3 years ago
14 changed files with 1469 additions and 82 deletions
Binary file not shown.
@ -0,0 +1,23 @@ |
|||||
|
## 1.2.5（2023-03-29） |
||||
|
- 新增 pattern.icon 属性，可自定义图标 |
||||
|
## 1.2.4（2022-09-07） |
||||
|
小程序端由于 style 使用了对象导致报错，[详情](https://ask.dcloud.net.cn/question/152790?item_id=211778&rf=false) |
||||
|
## 1.2.3（2022-09-05） |
||||
|
- 修复 nvue 环境下，具有 tabBar 时，fab 组件下部位置无法正常获取 --window-bottom 的bug，详见：[https://ask.dcloud.net.cn/question/110638?notification_id=826310](https://ask.dcloud.net.cn/question/110638?notification_id=826310) |
||||
|
## 1.2.2（2021-12-29） |
||||
|
- 更新 组件依赖 |
||||
|
## 1.2.1（2021-11-19） |
||||
|
- 修复 阴影颜色不正确的bug |
||||
|
## 1.2.0（2021-11-19） |
||||
|
- 优化 组件UI，并提供设计资源，详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource) |
||||
|
- 文档迁移，详见:[https://uniapp.dcloud.io/component/uniui/uni-fab](https://uniapp.dcloud.io/component/uniui/uni-fab) |
||||
|
## 1.1.1（2021-11-09） |
||||
|
- 新增 提供组件设计资源，组件样式调整 |
||||
|
## 1.1.0（2021-07-30） |
||||
|
- 组件兼容 vue3，如何创建vue3项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834) |
||||
|
## 1.0.7（2021-05-12） |
||||
|
- 新增 组件示例地址 |
||||
|
## 1.0.6（2021-02-05） |
||||
|
- 调整为uni_modules目录规范 |
||||
|
- 优化 按钮背景色调整 |
||||
|
- 优化 兼容pc端 |
||||
@ -0,0 +1,491 @@ |
|||||
|
<template> |
||||
|
<view class="uni-cursor-point"> |
||||
|
<view v-if="popMenu && (leftBottom||rightBottom||leftTop||rightTop) && content.length > 0" :class="{ |
||||
|
'uni-fab--leftBottom': leftBottom, |
||||
|
'uni-fab--rightBottom': rightBottom, |
||||
|
'uni-fab--leftTop': leftTop, |
||||
|
'uni-fab--rightTop': rightTop |
||||
|
}" class="uni-fab" |
||||
|
:style="nvueBottom" |
||||
|
> |
||||
|
<view :class="{ |
||||
|
'uni-fab__content--left': horizontal === 'left', |
||||
|
'uni-fab__content--right': horizontal === 'right', |
||||
|
'uni-fab__content--flexDirection': direction === 'vertical', |
||||
|
'uni-fab__content--flexDirectionStart': flexDirectionStart, |
||||
|
'uni-fab__content--flexDirectionEnd': flexDirectionEnd, |
||||
|
'uni-fab__content--other-platform': !isAndroidNvue |
||||
|
}" :style="{ width: boxWidth, height: boxHeight, backgroundColor: styles.backgroundColor }" |
||||
|
class="uni-fab__content" elevation="5"> |
||||
|
<view v-if="flexDirectionStart || horizontalLeft" class="uni-fab__item uni-fab__item--first" /> |
||||
|
<view v-for="(item, index) in content" :key="index" :class="{ 'uni-fab__item--active': isShow }" |
||||
|
class="uni-fab__item" @click="_onItemClick(index, item)"> |
||||
|
<image :src="item.active ? item.selectedIconPath : item.iconPath" class="uni-fab__item-image" |
||||
|
mode="aspectFit" /> |
||||
|
<text class="uni-fab__item-text" |
||||
|
:style="{ color: item.active ? styles.selectedColor : styles.color }">{{ item.text }}</text> |
||||
|
</view> |
||||
|
<view v-if="flexDirectionEnd || horizontalRight" class="uni-fab__item uni-fab__item--first" /> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view :class="{ |
||||
|
'uni-fab__circle--leftBottom': leftBottom, |
||||
|
'uni-fab__circle--rightBottom': rightBottom, |
||||
|
'uni-fab__circle--leftTop': leftTop, |
||||
|
'uni-fab__circle--rightTop': rightTop, |
||||
|
'uni-fab__content--other-platform': !isAndroidNvue |
||||
|
}" class="uni-fab__circle uni-fab__plus" :style="{ 'background-color': styles.buttonColor, 'bottom': nvueBottom }" @click="_onClick"> |
||||
|
<uni-icons class="fab-circle-icon" :type="styles.icon" :color="styles.iconColor" size="32" |
||||
|
:class="{'uni-fab__plus--active': isShow && content.length > 0}"></uni-icons> |
||||
|
<!-- <view class="fab-circle-v" :class="{'uni-fab__plus--active': isShow && content.length > 0}"></view> |
||||
|
<view class="fab-circle-h" :class="{'uni-fab__plus--active': isShow && content.length > 0}"></view> --> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
let platform = 'other' |
||||
|
// #ifdef APP-NVUE |
||||
|
platform = uni.getSystemInfoSync().platform |
||||
|
// #endif |
||||
|
|
||||
|
/** |
||||
|
* Fab 悬浮按钮 |
||||
|
* @description 点击可展开一个图形按钮菜单 |
||||
|
* @tutorial https://ext.dcloud.net.cn/plugin?id=144 |
||||
|
* @property {Object} pattern 可选样式配置项 |
||||
|
* @property {Object} horizontal = [left | right] 水平对齐方式 |
||||
|
* @value left 左对齐 |
||||
|
* @value right 右对齐 |
||||
|
* @property {Object} vertical = [bottom | top] 垂直对齐方式 |
||||
|
* @value bottom 下对齐 |
||||
|
* @value top 上对齐 |
||||
|
* @property {Object} direction = [horizontal | vertical] 展开菜单显示方式 |
||||
|
* @value horizontal 水平显示 |
||||
|
* @value vertical 垂直显示 |
||||
|
* @property {Array} content 展开菜单内容配置项 |
||||
|
* @property {Boolean} popMenu 是否使用弹出菜单 |
||||
|
* @event {Function} trigger 展开菜单点击事件，返回点击信息 |
||||
|
* @event {Function} fabClick 悬浮按钮点击事件 |
||||
|
*/ |
||||
|
export default { |
||||
|
name: 'UniFab', |
||||
|
emits: ['fabClick', 'trigger'], |
||||
|
props: { |
||||
|
pattern: { |
||||
|
type: Object, |
||||
|
default () { |
||||
|
return {} |
||||
|
} |
||||
|
}, |
||||
|
horizontal: { |
||||
|
type: String, |
||||
|
default: 'left' |
||||
|
}, |
||||
|
vertical: { |
||||
|
type: String, |
||||
|
default: 'bottom' |
||||
|
}, |
||||
|
direction: { |
||||
|
type: String, |
||||
|
default: 'horizontal' |
||||
|
}, |
||||
|
content: { |
||||
|
type: Array, |
||||
|
default () { |
||||
|
return [] |
||||
|
} |
||||
|
}, |
||||
|
show: { |
||||
|
type: Boolean, |
||||
|
default: false |
||||
|
}, |
||||
|
popMenu: { |
||||
|
type: Boolean, |
||||
|
default: true |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
fabShow: false, |
||||
|
isShow: false, |
||||
|
isAndroidNvue: platform === 'android', |
||||
|
styles: { |
||||
|
color: '#3c3e49', |
||||
|
selectedColor: '#007AFF', |
||||
|
backgroundColor: '#fff', |
||||
|
buttonColor: '#007AFF', |
||||
|
iconColor: '#fff', |
||||
|
icon: 'plusempty' |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
contentWidth(e) { |
||||
|
return (this.content.length + 1) * 55 + 15 + 'px' |
||||
|
}, |
||||
|
contentWidthMin() { |
||||
|
return '55px' |
||||
|
}, |
||||
|
// 动态计算宽度 |
||||
|
boxWidth() { |
||||
|
return this.getPosition(3, 'horizontal') |
||||
|
}, |
||||
|
// 动态计算高度 |
||||
|
boxHeight() { |
||||
|
return this.getPosition(3, 'vertical') |
||||
|
}, |
||||
|
// 计算左下位置 |
||||
|
leftBottom() { |
||||
|
return this.getPosition(0, 'left', 'bottom') |
||||
|
}, |
||||
|
// 计算右下位置 |
||||
|
rightBottom() { |
||||
|
return this.getPosition(0, 'right', 'bottom') |
||||
|
}, |
||||
|
// 计算左上位置 |
||||
|
leftTop() { |
||||
|
return this.getPosition(0, 'left', 'top') |
||||
|
}, |
||||
|
rightTop() { |
||||
|
return this.getPosition(0, 'right', 'top') |
||||
|
}, |
||||
|
flexDirectionStart() { |
||||
|
return this.getPosition(1, 'vertical', 'top') |
||||
|
}, |
||||
|
flexDirectionEnd() { |
||||
|
return this.getPosition(1, 'vertical', 'bottom') |
||||
|
}, |
||||
|
horizontalLeft() { |
||||
|
return this.getPosition(2, 'horizontal', 'left') |
||||
|
}, |
||||
|
horizontalRight() { |
||||
|
return this.getPosition(2, 'horizontal', 'right') |
||||
|
}, |
||||
|
// 计算 nvue bottom |
||||
|
nvueBottom() { |
||||
|
const safeBottom = uni.getSystemInfoSync().windowBottom; |
||||
|
// #ifdef APP-NVUE |
||||
|
return 30 + safeBottom |
||||
|
// #endif |
||||
|
// #ifndef APP-NVUE |
||||
|
return 30 |
||||
|
// #endif |
||||
|
} |
||||
|
}, |
||||
|
watch: { |
||||
|
pattern: { |
||||
|
handler(val, oldVal) { |
||||
|
this.styles = Object.assign({}, this.styles, val) |
||||
|
}, |
||||
|
deep: true |
||||
|
} |
||||
|
}, |
||||
|
created() { |
||||
|
this.isShow = this.show |
||||
|
if (this.top === 0) { |
||||
|
this.fabShow = true |
||||
|
} |
||||
|
// 初始化样式 |
||||
|
this.styles = Object.assign({}, this.styles, this.pattern) |
||||
|
}, |
||||
|
methods: { |
||||
|
_onClick() { |
||||
|
this.$emit('fabClick') |
||||
|
if (!this.popMenu) { |
||||
|
return |
||||
|
} |
||||
|
this.isShow = !this.isShow |
||||
|
}, |
||||
|
open() { |
||||
|
this.isShow = true |
||||
|
}, |
||||
|
close() { |
||||
|
this.isShow = false |
||||
|
}, |
||||
|
/** |
||||
|
* 按钮点击事件 |
||||
|
*/ |
||||
|
_onItemClick(index, item) { |
||||
|
if (!this.isShow) { |
||||
|
return |
||||
|
} |
||||
|
this.$emit('trigger', { |
||||
|
index, |
||||
|
item |
||||
|
}) |
||||
|
}, |
||||
|
/** |
||||
|
* 获取 位置信息 |
||||
|
*/ |
||||
|
getPosition(types, paramA, paramB) { |
||||
|
if (types === 0) { |
||||
|
return this.horizontal === paramA && this.vertical === paramB |
||||
|
} else if (types === 1) { |
||||
|
return this.direction === paramA && this.vertical === paramB |
||||
|
} else if (types === 2) { |
||||
|
return this.direction === paramA && this.horizontal === paramB |
||||
|
} else { |
||||
|
return this.isShow && this.direction === paramA ? this.contentWidth : this.contentWidthMin |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" > |
||||
|
$uni-shadow-base:0 1px 5px 2px rgba($color: #000000, $alpha: 0.3) !default; |
||||
|
|
||||
|
.uni-fab { |
||||
|
position: fixed; |
||||
|
/* #ifndef APP-NVUE */ |
||||
|
display: flex; |
||||
|
/* #endif */ |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
z-index: 10; |
||||
|
border-radius: 45px; |
||||
|
box-shadow: $uni-shadow-base; |
||||
|
} |
||||
|
|
||||
|
.uni-cursor-point { |
||||
|
/* #ifdef H5 */ |
||||
|
cursor: pointer; |
||||
|
/* #endif */ |
||||
|
} |
||||
|
|
||||
|
.uni-fab--active { |
||||
|
opacity: 1; |
||||
|
} |
||||
|
|
||||
|
.uni-fab--leftBottom { |
||||
|
left: 15px; |
||||
|
bottom: 30px; |
||||
|
/* #ifdef H5 */ |
||||
|
left: calc(15px + var(--window-left)); |
||||
|
bottom: calc(30px + var(--window-bottom)); |
||||
|
/* #endif */ |
||||
|
// padding: 10px; |
||||
|
} |
||||
|
|
||||
|
.uni-fab--leftTop { |
||||
|
left: 15px; |
||||
|
top: 30px; |
||||
|
/* #ifdef H5 */ |
||||
|
left: calc(15px + var(--window-left)); |
||||
|
top: calc(30px + var(--window-top)); |
||||
|
/* #endif */ |
||||
|
// padding: 10px; |
||||
|
} |
||||
|
|
||||
|
.uni-fab--rightBottom { |
||||
|
right: 15px; |
||||
|
bottom: 30px; |
||||
|
/* #ifdef H5 */ |
||||
|
right: calc(15px + var(--window-right)); |
||||
|
bottom: calc(30px + var(--window-bottom)); |
||||
|
/* #endif */ |
||||
|
// padding: 10px; |
||||
|
} |
||||
|
|
||||
|
.uni-fab--rightTop { |
||||
|
right: 15px; |
||||
|
top: 30px; |
||||
|
/* #ifdef H5 */ |
||||
|
right: calc(15px + var(--window-right)); |
||||
|
top: calc(30px + var(--window-top)); |
||||
|
/* #endif */ |
||||
|
// padding: 10px; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__circle { |
||||
|
position: fixed; |
||||
|
/* #ifndef APP-NVUE */ |
||||
|
display: flex; |
||||
|
/* #endif */ |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
width: 55px; |
||||
|
height: 55px; |
||||
|
background-color: #3c3e49; |
||||
|
border-radius: 45px; |
||||
|
z-index: 11; |
||||
|
// box-shadow: $uni-shadow-base; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__circle--leftBottom { |
||||
|
left: 15px; |
||||
|
bottom: 30px; |
||||
|
/* #ifdef H5 */ |
||||
|
left: calc(15px + var(--window-left)); |
||||
|
bottom: calc(30px + var(--window-bottom)); |
||||
|
/* #endif */ |
||||
|
} |
||||
|
|
||||
|
.uni-fab__circle--leftTop { |
||||
|
left: 15px; |
||||
|
top: 30px; |
||||
|
/* #ifdef H5 */ |
||||
|
left: calc(15px + var(--window-left)); |
||||
|
top: calc(30px + var(--window-top)); |
||||
|
/* #endif */ |
||||
|
} |
||||
|
|
||||
|
.uni-fab__circle--rightBottom { |
||||
|
right: 15px; |
||||
|
bottom: 30px; |
||||
|
/* #ifdef H5 */ |
||||
|
right: calc(15px + var(--window-right)); |
||||
|
bottom: calc(30px + var(--window-bottom)); |
||||
|
/* #endif */ |
||||
|
} |
||||
|
|
||||
|
.uni-fab__circle--rightTop { |
||||
|
right: 15px; |
||||
|
top: 30px; |
||||
|
/* #ifdef H5 */ |
||||
|
right: calc(15px + var(--window-right)); |
||||
|
top: calc(30px + var(--window-top)); |
||||
|
/* #endif */ |
||||
|
} |
||||
|
|
||||
|
.uni-fab__circle--left { |
||||
|
left: 0; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__circle--right { |
||||
|
right: 0; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__circle--top { |
||||
|
top: 0; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__circle--bottom { |
||||
|
bottom: 0; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__plus { |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
|
||||
|
// .fab-circle-v { |
||||
|
// position: absolute; |
||||
|
// width: 2px; |
||||
|
// height: 24px; |
||||
|
// left: 0; |
||||
|
// top: 0; |
||||
|
// right: 0; |
||||
|
// bottom: 0; |
||||
|
// /* #ifndef APP-NVUE */ |
||||
|
// margin: auto; |
||||
|
// /* #endif */ |
||||
|
// background-color: white; |
||||
|
// transform: rotate(0deg); |
||||
|
// transition: transform 0.3s; |
||||
|
// } |
||||
|
|
||||
|
// .fab-circle-h { |
||||
|
// position: absolute; |
||||
|
// width: 24px; |
||||
|
// height: 2px; |
||||
|
// left: 0; |
||||
|
// top: 0; |
||||
|
// right: 0; |
||||
|
// bottom: 0; |
||||
|
// /* #ifndef APP-NVUE */ |
||||
|
// margin: auto; |
||||
|
// /* #endif */ |
||||
|
// background-color: white; |
||||
|
// transform: rotate(0deg); |
||||
|
// transition: transform 0.3s; |
||||
|
// } |
||||
|
|
||||
|
.fab-circle-icon { |
||||
|
transform: rotate(0deg); |
||||
|
transition: transform 0.3s; |
||||
|
font-weight: 200; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__plus--active { |
||||
|
transform: rotate(135deg); |
||||
|
} |
||||
|
|
||||
|
.uni-fab__content { |
||||
|
/* #ifndef APP-NVUE */ |
||||
|
box-sizing: border-box; |
||||
|
display: flex; |
||||
|
/* #endif */ |
||||
|
flex-direction: row; |
||||
|
border-radius: 55px; |
||||
|
overflow: hidden; |
||||
|
transition-property: width, height; |
||||
|
transition-duration: 0.2s; |
||||
|
width: 55px; |
||||
|
border-color: #DDDDDD; |
||||
|
border-width: 1rpx; |
||||
|
border-style: solid; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__content--other-platform { |
||||
|
border-width: 0px; |
||||
|
box-shadow: $uni-shadow-base; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__content--left { |
||||
|
justify-content: flex-start; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__content--right { |
||||
|
justify-content: flex-end; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__content--flexDirection { |
||||
|
flex-direction: column; |
||||
|
justify-content: flex-end; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__content--flexDirectionStart { |
||||
|
flex-direction: column; |
||||
|
justify-content: flex-start; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__content--flexDirectionEnd { |
||||
|
flex-direction: column; |
||||
|
justify-content: flex-end; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__item { |
||||
|
/* #ifndef APP-NVUE */ |
||||
|
display: flex; |
||||
|
/* #endif */ |
||||
|
flex-direction: column; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
width: 55px; |
||||
|
height: 55px; |
||||
|
opacity: 0; |
||||
|
transition: opacity 0.2s; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__item--active { |
||||
|
opacity: 1; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__item-image { |
||||
|
width: 20px; |
||||
|
height: 20px; |
||||
|
margin-bottom: 4px; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__item-text { |
||||
|
color: #FFFFFF; |
||||
|
font-size: 12px; |
||||
|
line-height: 12px; |
||||
|
margin-top: 2px; |
||||
|
} |
||||
|
|
||||
|
.uni-fab__item--first { |
||||
|
width: 55px; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,84 @@ |
|||||
|
{ |
||||
|
"id": "uni-fab", |
||||
|
"displayName": "uni-fab 悬浮按钮", |
||||
|
"version": "1.2.5", |
||||
|
"description": "悬浮按钮 fab button ，点击可展开一个图标按钮菜单。", |
||||
|
"keywords": [ |
||||
|
"uni-ui", |
||||
|
"uniui", |
||||
|
"按钮", |
||||
|
"悬浮按钮", |
||||
|
"fab" |
||||
|
], |
||||
|
"repository": "https://github.com/dcloudio/uni-ui", |
||||
|
"engines": { |
||||
|
"HBuilderX": "" |
||||
|
}, |
||||
|
"directories": { |
||||
|
"example": "../../temps/example_temps" |
||||
|
}, |
||||
|
"dcloudext": { |
||||
|
"sale": { |
||||
|
"regular": { |
||||
|
"price": "0.00" |
||||
|
}, |
||||
|
"sourcecode": { |
||||
|
"price": "0.00" |
||||
|
} |
||||
|
}, |
||||
|
"contact": { |
||||
|
"qq": "" |
||||
|
}, |
||||
|
"declaration": { |
||||
|
"ads": "无", |
||||
|
"data": "无", |
||||
|
"permissions": "无" |
||||
|
}, |
||||
|
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui", |
||||
|
"type": "component-vue" |
||||
|
}, |
||||
|
"uni_modules": { |
||||
|
"dependencies": ["uni-scss","uni-icons"], |
||||
|
"encrypt": [], |
||||
|
"platforms": { |
||||
|
"cloud": { |
||||
|
"tcb": "y", |
||||
|
"aliyun": "y" |
||||
|
}, |
||||
|
"client": { |
||||
|
"App": { |
||||
|
"app-vue": "y", |
||||
|
"app-nvue": "y" |
||||
|
}, |
||||
|
"H5-mobile": { |
||||
|
"Safari": "y", |
||||
|
"Android Browser": "y", |
||||
|
"微信浏览器(Android)": "y", |
||||
|
"QQ浏览器(Android)": "y" |
||||
|
}, |
||||
|
"H5-pc": { |
||||
|
"Chrome": "y", |
||||
|
"IE": "y", |
||||
|
"Edge": "y", |
||||
|
"Firefox": "y", |
||||
|
"Safari": "y" |
||||
|
}, |
||||
|
"小程序": { |
||||
|
"微信": "y", |
||||
|
"阿里": "y", |
||||
|
"百度": "y", |
||||
|
"字节跳动": "y", |
||||
|
"QQ": "y" |
||||
|
}, |
||||
|
"快应用": { |
||||
|
"华为": "u", |
||||
|
"联盟": "u" |
||||
|
}, |
||||
|
"Vue": { |
||||
|
"vue2": "y", |
||||
|
"vue3": "y" |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,9 @@ |
|||||
|
## Fab 悬浮按钮 |
||||
|
> **组件名：uni-fab** |
||||
|
> 代码块： `uFab` |
||||
|
|
||||
|
|
||||
|
点击可展开一个图形按钮菜单 |
||||
|
|
||||
|
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-fab) |
||||
|
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839 |
||||
@ -0,0 +1,89 @@ |
|||||
|
<template> |
||||
|
<text class="uni-icons" :style="styleObj"> |
||||
|
<slot>{{unicode}}</slot> |
||||
|
</text> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { fontData, IconsDataItem } from './uniicons_file' |
||||
|
|
||||
|
/** |
||||
|
* Icons 图标 |
||||
|
* @description 用于展示 icon 图标 |
||||
|
* @tutorial https://ext.dcloud.net.cn/plugin?id=28 |
||||
|
* @property {Number} size 图标大小 |
||||
|
* @property {String} type 图标图案，参考示例 |
||||
|
* @property {String} color 图标颜色 |
||||
|
* @property {String} customPrefix 自定义图标 |
||||
|
* @event {Function} click 点击 Icon 触发事件 |
||||
|
*/ |
||||
|
export default { |
||||
|
name: "uni-icons", |
||||
|
props: { |
||||
|
type: { |
||||
|
type: String, |
||||
|
default: '' |
||||
|
}, |
||||
|
color: { |
||||
|
type: String, |
||||
|
default: '#333333' |
||||
|
}, |
||||
|
size: { |
||||
|
type: Object, |
||||
|
default: 24 |
||||
|
}, |
||||
|
fontFamily: { |
||||
|
type: String, |
||||
|
default: '' |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return {}; |
||||
|
}, |
||||
|
computed: { |
||||
|
unicode() : string { |
||||
|
let codes = fontData.find((item : IconsDataItem) : boolean => { return item.font_class == this.type }) |
||||
|
if (codes !== null) { |
||||
|
return codes.unicode |
||||
|
} |
||||
|
return '' |
||||
|
}, |
||||
|
iconSize() : string { |
||||
|
if (typeof this.size == 'string') { |
||||
|
return '' + this.size |
||||
|
} |
||||
|
const size = this.size as number |
||||
|
return this.getFontSize(size) |
||||
|
}, |
||||
|
styleObj() : UTSJSONObject { |
||||
|
if (this.fontFamily !== '') { |
||||
|
return { color: this.color, fontSize: this.iconSize, fontFamily: this.fontFamily } |
||||
|
} |
||||
|
return { color: this.color, fontSize: this.iconSize } |
||||
|
} |
||||
|
}, |
||||
|
created() { }, |
||||
|
methods: { |
||||
|
/** |
||||
|
* 字体大小 |
||||
|
*/ |
||||
|
getFontSize(size : number) : string { |
||||
|
return size + 'px'; |
||||
|
}, |
||||
|
}, |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped> |
||||
|
@font-face { |
||||
|
font-family: UniIconsFontFamily; |
||||
|
src: url('./uniicons.ttf'); |
||||
|
} |
||||
|
|
||||
|
.uni-icons { |
||||
|
font-family: UniIconsFontFamily; |
||||
|
font-size: 18px; |
||||
|
font-style: normal; |
||||
|
color: #333; |
||||
|
} |
||||
|
</style> |
||||
Binary file not shown.
@ -0,0 +1,664 @@ |
|||||
|
|
||||
|
export type IconsData = { |
||||
|
id : string |
||||
|
name : string |
||||
|
font_family : string |
||||
|
css_prefix_text : string |
||||
|
description : string |
||||
|
glyphs : Array<IconsDataItem> |
||||
|
} |
||||
|
|
||||
|
export type IconsDataItem = { |
||||
|
font_class : string |
||||
|
unicode : string |
||||
|
} |
||||
|
|
||||
|
|
||||
|
export const fontData = [ |
||||
|
{ |
||||
|
"font_class": "arrow-down", |
||||
|
"unicode": "\ue6be" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "arrow-left", |
||||
|
"unicode": "\ue6bc" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "arrow-right", |
||||
|
"unicode": "\ue6bb" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "arrow-up", |
||||
|
"unicode": "\ue6bd" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "auth", |
||||
|
"unicode": "\ue6ab" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "auth-filled", |
||||
|
"unicode": "\ue6cc" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "back", |
||||
|
"unicode": "\ue6b9" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "bars", |
||||
|
"unicode": "\ue627" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "calendar", |
||||
|
"unicode": "\ue6a0" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "calendar-filled", |
||||
|
"unicode": "\ue6c0" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "camera", |
||||
|
"unicode": "\ue65a" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "camera-filled", |
||||
|
"unicode": "\ue658" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "cart", |
||||
|
"unicode": "\ue631" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "cart-filled", |
||||
|
"unicode": "\ue6d0" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "chat", |
||||
|
"unicode": "\ue65d" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "chat-filled", |
||||
|
"unicode": "\ue659" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "chatboxes", |
||||
|
"unicode": "\ue696" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "chatboxes-filled", |
||||
|
"unicode": "\ue692" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "chatbubble", |
||||
|
"unicode": "\ue697" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "chatbubble-filled", |
||||
|
"unicode": "\ue694" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "checkbox", |
||||
|
"unicode": "\ue62b" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "checkbox-filled", |
||||
|
"unicode": "\ue62c" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "checkmarkempty", |
||||
|
"unicode": "\ue65c" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "circle", |
||||
|
"unicode": "\ue65b" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "circle-filled", |
||||
|
"unicode": "\ue65e" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "clear", |
||||
|
"unicode": "\ue66d" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "close", |
||||
|
"unicode": "\ue673" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "closeempty", |
||||
|
"unicode": "\ue66c" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "cloud-download", |
||||
|
"unicode": "\ue647" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "cloud-download-filled", |
||||
|
"unicode": "\ue646" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "cloud-upload", |
||||
|
"unicode": "\ue645" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "cloud-upload-filled", |
||||
|
"unicode": "\ue648" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "color", |
||||
|
"unicode": "\ue6cf" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "color-filled", |
||||
|
"unicode": "\ue6c9" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "compose", |
||||
|
"unicode": "\ue67f" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "contact", |
||||
|
"unicode": "\ue693" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "contact-filled", |
||||
|
"unicode": "\ue695" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "down", |
||||
|
"unicode": "\ue6b8" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "bottom", |
||||
|
"unicode": "\ue6b8" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "download", |
||||
|
"unicode": "\ue68d" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "download-filled", |
||||
|
"unicode": "\ue681" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "email", |
||||
|
"unicode": "\ue69e" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "email-filled", |
||||
|
"unicode": "\ue69a" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "eye", |
||||
|
"unicode": "\ue651" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "eye-filled", |
||||
|
"unicode": "\ue66a" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "eye-slash", |
||||
|
"unicode": "\ue6b3" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "eye-slash-filled", |
||||
|
"unicode": "\ue6b4" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "fire", |
||||
|
"unicode": "\ue6a1" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "fire-filled", |
||||
|
"unicode": "\ue6c5" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "flag", |
||||
|
"unicode": "\ue65f" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "flag-filled", |
||||
|
"unicode": "\ue660" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "folder-add", |
||||
|
"unicode": "\ue6a9" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "folder-add-filled", |
||||
|
"unicode": "\ue6c8" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "font", |
||||
|
"unicode": "\ue6a3" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "forward", |
||||
|
"unicode": "\ue6ba" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "gear", |
||||
|
"unicode": "\ue664" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "gear-filled", |
||||
|
"unicode": "\ue661" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "gift", |
||||
|
"unicode": "\ue6a4" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "gift-filled", |
||||
|
"unicode": "\ue6c4" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "hand-down", |
||||
|
"unicode": "\ue63d" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "hand-down-filled", |
||||
|
"unicode": "\ue63c" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "hand-up", |
||||
|
"unicode": "\ue63f" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "hand-up-filled", |
||||
|
"unicode": "\ue63e" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "headphones", |
||||
|
"unicode": "\ue630" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "heart", |
||||
|
"unicode": "\ue639" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "heart-filled", |
||||
|
"unicode": "\ue641" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "help", |
||||
|
"unicode": "\ue679" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "help-filled", |
||||
|
"unicode": "\ue674" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "home", |
||||
|
"unicode": "\ue662" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "home-filled", |
||||
|
"unicode": "\ue663" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "image", |
||||
|
"unicode": "\ue670" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "image-filled", |
||||
|
"unicode": "\ue678" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "images", |
||||
|
"unicode": "\ue650" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "images-filled", |
||||
|
"unicode": "\ue64b" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "info", |
||||
|
"unicode": "\ue669" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "info-filled", |
||||
|
"unicode": "\ue649" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "left", |
||||
|
"unicode": "\ue6b7" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "link", |
||||
|
"unicode": "\ue6a5" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "list", |
||||
|
"unicode": "\ue644" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "location", |
||||
|
"unicode": "\ue6ae" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "location-filled", |
||||
|
"unicode": "\ue6af" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "locked", |
||||
|
"unicode": "\ue66b" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "locked-filled", |
||||
|
"unicode": "\ue668" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "loop", |
||||
|
"unicode": "\ue633" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "mail-open", |
||||
|
"unicode": "\ue643" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "mail-open-filled", |
||||
|
"unicode": "\ue63a" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "map", |
||||
|
"unicode": "\ue667" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "map-filled", |
||||
|
"unicode": "\ue666" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "map-pin", |
||||
|
"unicode": "\ue6ad" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "map-pin-ellipse", |
||||
|
"unicode": "\ue6ac" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "medal", |
||||
|
"unicode": "\ue6a2" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "medal-filled", |
||||
|
"unicode": "\ue6c3" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "mic", |
||||
|
"unicode": "\ue671" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "mic-filled", |
||||
|
"unicode": "\ue677" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "micoff", |
||||
|
"unicode": "\ue67e" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "micoff-filled", |
||||
|
"unicode": "\ue6b0" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "minus", |
||||
|
"unicode": "\ue66f" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "minus-filled", |
||||
|
"unicode": "\ue67d" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "more", |
||||
|
"unicode": "\ue64d" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "more-filled", |
||||
|
"unicode": "\ue64e" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "navigate", |
||||
|
"unicode": "\ue66e" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "navigate-filled", |
||||
|
"unicode": "\ue67a" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "notification", |
||||
|
"unicode": "\ue6a6" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "notification-filled", |
||||
|
"unicode": "\ue6c1" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "paperclip", |
||||
|
"unicode": "\ue652" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "paperplane", |
||||
|
"unicode": "\ue672" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "paperplane-filled", |
||||
|
"unicode": "\ue675" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "person", |
||||
|
"unicode": "\ue699" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "person-filled", |
||||
|
"unicode": "\ue69d" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "personadd", |
||||
|
"unicode": "\ue69f" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "personadd-filled", |
||||
|
"unicode": "\ue698" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "personadd-filled-copy", |
||||
|
"unicode": "\ue6d1" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "phone", |
||||
|
"unicode": "\ue69c" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "phone-filled", |
||||
|
"unicode": "\ue69b" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "plus", |
||||
|
"unicode": "\ue676" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "plus-filled", |
||||
|
"unicode": "\ue6c7" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "plusempty", |
||||
|
"unicode": "\ue67b" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "pulldown", |
||||
|
"unicode": "\ue632" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "pyq", |
||||
|
"unicode": "\ue682" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "qq", |
||||
|
"unicode": "\ue680" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "redo", |
||||
|
"unicode": "\ue64a" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "redo-filled", |
||||
|
"unicode": "\ue655" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "refresh", |
||||
|
"unicode": "\ue657" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "refresh-filled", |
||||
|
"unicode": "\ue656" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "refreshempty", |
||||
|
"unicode": "\ue6bf" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "reload", |
||||
|
"unicode": "\ue6b2" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "right", |
||||
|
"unicode": "\ue6b5" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "scan", |
||||
|
"unicode": "\ue62a" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "search", |
||||
|
"unicode": "\ue654" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "settings", |
||||
|
"unicode": "\ue653" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "settings-filled", |
||||
|
"unicode": "\ue6ce" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "shop", |
||||
|
"unicode": "\ue62f" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "shop-filled", |
||||
|
"unicode": "\ue6cd" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "smallcircle", |
||||
|
"unicode": "\ue67c" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "smallcircle-filled", |
||||
|
"unicode": "\ue665" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "sound", |
||||
|
"unicode": "\ue684" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "sound-filled", |
||||
|
"unicode": "\ue686" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "spinner-cycle", |
||||
|
"unicode": "\ue68a" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "staff", |
||||
|
"unicode": "\ue6a7" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "staff-filled", |
||||
|
"unicode": "\ue6cb" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "star", |
||||
|
"unicode": "\ue688" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "star-filled", |
||||
|
"unicode": "\ue68f" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "starhalf", |
||||
|
"unicode": "\ue683" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "trash", |
||||
|
"unicode": "\ue687" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "trash-filled", |
||||
|
"unicode": "\ue685" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "tune", |
||||
|
"unicode": "\ue6aa" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "tune-filled", |
||||
|
"unicode": "\ue6ca" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "undo", |
||||
|
"unicode": "\ue64f" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "undo-filled", |
||||
|
"unicode": "\ue64c" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "up", |
||||
|
"unicode": "\ue6b6" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "top", |
||||
|
"unicode": "\ue6b6" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "upload", |
||||
|
"unicode": "\ue690" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "upload-filled", |
||||
|
"unicode": "\ue68e" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "videocam", |
||||
|
"unicode": "\ue68c" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "videocam-filled", |
||||
|
"unicode": "\ue689" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "vip", |
||||
|
"unicode": "\ue6a8" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "vip-filled", |
||||
|
"unicode": "\ue6c6" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "wallet", |
||||
|
"unicode": "\ue6b1" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "wallet-filled", |
||||
|
"unicode": "\ue6c2" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "weibo", |
||||
|
"unicode": "\ue68b" |
||||
|
}, |
||||
|
{ |
||||
|
"font_class": "weixin", |
||||
|
"unicode": "\ue691" |
||||
|
} |
||||
|
] as IconsDataItem[] |
||||
|
|
||||
|
// export const fontData = JSON.parse<IconsDataItem>(fontDataJson)
|
||||
Binary file not shown.
Binary file not shown.
Loading…
Reference in new issue