# Text 文本

此组件集成了文本类在项目中的常用功能 您大可不必在使用特殊文本时自己定义,text组件几乎涵盖您能使用的大部分场景。

# 基本使用

  • 通过text参数设置文本内容。推荐您使用:text='value'的形式
<un-text text="我用十年青春,赴你最后之约"></un-text>
✅ Copy success!

# 设置主题

  • 通过type参数设置文本主题,我们提供了五类属性。
  • primary error success warning info
<un-text type="primary" text="主色"></un-text>
<un-text type="error"   text="错误"></un-text>
<un-text type="success" text="成功"></un-text>
<un-text type="warning" text="警告"></un-text>
<un-text type="info"    text="信息"></un-text>
✅ Copy success!

# 前后图标

添加prefixIcon,suffixIcon指定图标和位置,iconStyle设置图标大小

<un-text prefixIcon="baidu" iconStyle="font-size: 19px" text="百度一下,你就知道"></un-text>
<un-text suffixIcon="arrow-leftward" iconStyle="font-size: 18px" text="查看更多"></un-text>
✅ Copy success!

# 超出隐藏

内置了文字超出隐藏样式,设置lines属性表明几行后隐藏

<un-text :lines="2" text="关于uView的取名来由,首字母u来自于uni-app首字母,
uni-app是基Vuejs,Vue和View(延伸为UI、视图之意)同音,同时view组件uni-app中
最础最重要的组件,故取名uView,表达源于uni-app和Vue之意,同时在此也对它示感谢。"></un-text>
✅ Copy success!

# API

# List Props

参数 说明 类型 默认值 可选值
type 主题颜色 String - -
show 是否显示 Boolean true false
text 显示的值 String | Number - -
prefixIcon 前置图标 String - -
suffixIcon 后置图标 String - -
call mode=phone时,点击文本是否拨打电话 Boolean false true
bold 是否粗体,默认normal Boolean false true
block 是否块状 Boolean false true
lines 文本显示的行数,如果设置,超出此行数,将会显示省略号 String | Number - -
color 文本颜色 String #303133 -
size 字体大小 String | Number 15 -
iconStyle 图标的样式 Object | String 15px -
decoration 文字装饰,下划线,中划线等 String none underline/line-through
margin 外边距,对象、字符串,数值形式均可 Object | Number | String - -
lineHeight 文本行高 Number | String - -
align 文本对齐方式 String left center/right
wordWrap 文字换行 String normal break-word/anywhere

# List Events

事件名 说明 回调参数
click 点击触发事件 -
上次更新时间: 2025/10/28 21:19:58
当前文档拷贝至3.x版本,尚不完善,我们正在努力完善中,欢迎您的反馈和参与改进。
×