You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
apply-assistant-v3/pages/NEUIKit/components/Icon.vue

79 lines
1.9 KiB
Vue

5 months ago
<template>
<view :class="className" :style="iconStyle">
<!-- #ifdef APP-PLUS -->
<image
:src="_url"
:style="{
width: (width || size) + 'px',
height: (height || size) + 'px',
}"
class="icon"
/>
<!-- #endif -->
<!-- #ifndef APP-PLUS -->
<img
:src="_url"
:style="{
width: (width || size) + 'px',
height: (height || size) + 'px',
}"
class="icon"
/>
<!-- #endif -->
</view>
</template>
<script lang="ts" setup>
// svg 解决方案参考https://github.com/iconfont-cli/mini-program-iconfont-cli/tree/master
import { computed, defineProps, withDefaults } from '../utils/transformVue'
const props = withDefaults(
defineProps<{
type: string
size?: number
width?: number
height?: number
iconClassName?: string
iconStyle?: any
}>(),
{
size: 16,
}
)
const urlMap = {
'icon-yanzheng':
'https://yx-web-nosdn.netease.im/common/5a0c2769626284ff646298a7ef1f66c2/icon-yanzheng.png',
'icon-lahei2':
'https://yx-web-nosdn.netease.im/common/1ee2a3bffb33b81727583189a2562658/icon-lahei2.png',
'icon-xiaoximiandarao':
'https://yx-web-nosdn.netease.im/common/1c92731bb3fa91fa3fc5ff45bf9e4dbe/icon-xiaoximiandarao.png',
'icon-read':
'https://matripe-cms.oss-cn-beijing.aliyuncs.com/bocaigongyinglian/wyyx_check_0514.svg',
}
//以上链接访问有频率控制,建议您将静态放到您服务器上,然后修改上面的链接即可
const _url = computed(() => {
// @ts-ignore
return urlMap[props.type]
})
// const prefix = 'https://yiyong-qa.netease.im/yiyong-static/statics/uniapp-vue2-h5'
// const url = computed(() => {
// return `${prefix}/static/icons/${props.type}.png`
// })
const className = `${props.iconClassName || ''} icon-wrapper`
</script>
<style scoped lang="scss">
.icon-wrapper {
display: inline-block;
line-height: 0;
}
.icon {
display: inline-block;
vertical-align: middle;
}
</style>