You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
This file contains invisible Unicode characters that may be processed differently from what appears below. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to reveal hidden characters.
< template >
<!-- # ifdef APP - NVUE -- >
< text : style = "{ color: color, 'font-size': iconSize }" class = "uni-icons" @click ="_onClick" > {{ unicode }} < / text >
< ! - - # endif - - >
<!-- # ifndef APP - NVUE -- >
< text : style = "{ color: color, 'font-size': iconSize }" class = "uni-icons" :class ="['uniui-'+type,customPrefix,customPrefix?type:'']" @click ="_onClick" > < / text >
< ! - - # endif - - >
< / template >
< script >
import icons from './icons.js' ;
const getVal = ( val ) => {
const reg = /^[0-9]*$/g
return ( typeof val === 'number' || reg . test ( val ) ) ? val + 'px' : val ;
}
// #ifdef APP-NVUE
var domModule = weex . requireModule ( 'dom' ) ;
import iconUrl from './uniicons.ttf'
domModule . addRule ( 'fontFace' , {
'fontFamily' : "uniicons" ,
'src' : "url('" + iconUrl + "')"
} ) ;
// #endif
/**
* Icons 图标
* @description 用于展示 icons 图标
* @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 : 'UniIcons' ,
emits : [ 'click' ] ,
props : {
type : {
type : String ,
default : ''
} ,
color : {
type : String ,
default : '#333333'
} ,
size : {
type : [ Number , String ] ,
default : 16
} ,
customPrefix : {
type : String ,
default : ''
}
} ,
data ( ) {
return {
icons : icons . glyphs
}
} ,
computed : {
unicode ( ) {
let code = this . icons . find ( v => v . font _class === this . type )
if ( code ) {
return unescape ( ` %u ${ code . unicode } ` )
}
return ''
} ,
iconSize ( ) {
return getVal ( this . size )
}
} ,
methods : {
_onClick ( ) {
this . $emit ( 'click' )
}
}
}
< / script >
< style lang = "scss" >
/* #ifndef APP-NVUE */
@ import './uniicons.css' ;
@ font - face {
font - family : uniicons ;
src : url ( './uniicons.ttf' ) format ( 'truetype' ) ;
}
/* #endif */
. uni - icons {
font - family : uniicons ;
text - decoration : none ;
text - align : center ;
}
< / style >
