# Text文本

此组件集成了文本类在项目中的常用功能；

主要用于文本展示和格式化的场景

# 基本使用

# 价格展示

<!-- 价格(千分位展示)如果有小数部分，默认将保留2位 -->
<com-text type="price" :value="15693564.456"></com-text>

# 日期格式化

<!-- 时间戳 => 年月日 -->
<com-text type="date" value="1451967620000"></com-text>

<!-- 时间戳(毫秒级) => 年月日 时分秒 -->
<com-text type="datetime" value="1451967620000"></com-text>

<!-- 时间戳(秒级) => 年月日 时分秒 -->
<com-text type="datetime" value="1451967620"></com-text>

<!-- 时间戳 => 时分秒 -->
<com-text type="time" value="1451967620000" font-size="36"></com-text>

# 空值处理

<com-text type="text" :value="null" :text="null"></com-text>
<com-text type="text" value="null" text="null"></com-text>
<com-text type="text" value="undefined" text="undefined"></com-text>
<com-text type="text" :value="undefined" :text="undefined"></com-text>

<!-- 自定义空值显示内容 -->
<com-text type="text" value="undefined" text="无"></com-text>

# 敏感信息处理

<!-- 手机号将隐藏中间4位 -->
<com-text type="phone" value="18773135236" secret></com-text>
<!-- 身份证将隐藏中间8位 -->
<com-text type="idcard" value="430321199x1104332x" secret></com-text>
<!-- 姓名等将隐藏中间位 -->
<com-text type="text" value="唐小婉" secret></com-text>
<com-text type="text" value="张三" secret></com-text>

# 复制

<!-- 开启复制 -->
<com-text value="云迈科技有限公司" text="复制" enable-copy></com-text>

# 数据字典

<!-- 单值渲染 -->
<com-text type="dict" value="1" :list="options"></com-text>

<!-- 多值渲染 -->
<com-text type="dict" multi value="1,2" :list="options"></com-text>

<!-- 多值渲染(自定义分隔符) -->
<com-text type="dict" multi value="1,2" 
    :list="options" seperator=" | "></com-text>

<script>
    data() {
        return {
            options: [
                { label: '北京', value: 1 },
                { label: '湖南', value: 2 },
                { label: '河南', value: 3 },
                { label: '广东', value: 4 },
            ],
        }
    },
</script>

# API

# Props

属性名	说明	类型	必填	默认值
value	值，通常是内部需要用于计算的值	—	`false`	-
type	组件类型： text 普通文本 price 价格 phone 手机号 idcard 身份证 date 日期 datetime 日期+时间 time 时间 dict 数据字典	`String`	`false`	text
text	展示的文本内容	`String` / `Number`	`false`	-
emptyText	空数据或者NaN时展示的文字	`String`	`false`	--
secret	是否加密，一般用于展示姓名/手机号/身份证等敏感信息时	`Boolean`	`false`	false
fontSize	字体大小	`String` / `Number`	`false`	28
color	文本颜色	`String`	`false`	-
customStyle	文本样式	`Object`	`false`	{}
enableCopy	允许复制	`Boolean`	`false`	false
copyTip	复制成功时的提示, 不想弹出提示则传空字符串	`String`	`false`	复制成功
list	数据字典列表	`Array`	`false`	[]
labelKey	数据字典标签对应字段名称	`String`	`false`	label
valueKey	数据字典值对应的字段名称	`String`	`false`	value
multi	是否展示数据字典多个值	`Boolean`	`false`	false
seperator	分隔符	`String`	`false`	,

# Events

事件	说明	回调参数
click	点击时触发	-

← 目录结构 Image 图片 →