RN溢出显示省略号代码

js 复制代码
import React from 'react'
import { View, Text, StyleSheet } from 'react-native'

const App = () => {
  return (
    // 可以在父标签加宽度限制
    <View style={styles.container}>
      {/* 也可以自己给宽度限制,简单来说就是只要给text限制宽度就行,没宽度就参考父标签宽度 */}
      <Text style={{ width: 300 }} numberOfLines={1} ellipsizeMode="tail">
        这是一段可能会溢出的文本,设置了显示省略号。
      </Text>
    </View>
  )
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    // width: 300,
    justifyContent: 'center',
    alignItems: 'center',
  },
})

export default App
相关推荐
小心我捶你啊5 小时前
数据采集和Web解锁不是一回事,从用途到规则区分
前端·爬虫·网络协议
hunterandroid5 小时前
[鸿蒙从零到一] ArkUI 基础组件实战:Text、Image、Button 与 TextInput
前端
fsssb5 小时前
Chromium 源码学习笔记(五):一次点击,在进入 JS 之前先经历了什么?
前端
hunterandroid5 小时前
WorkManager 可靠性实战:唯一任务、重试与幂等设计
android·前端
鹿目5 小时前
使用 Vant CLI 搭建 UI 组件库:从 H5 到小程序跨平台
前端·javascript
默_笙5 小时前
😭 我花了两小时找了一个数据结构 bug,才把"迷你 Cursor"跑起来,绝望(bushi)
前端·javascript
竹林8186 小时前
wagmi v2 监听合约事件踩坑记:从 `useContractEvent` 到 `watchContractEvent`,我重构了三版才搞定实时数据流
前端·javascript
天若有情6736 小时前
纯HTML+Tailwind单页作品集网站——零框架静态前端完整源码
前端·html
WebGirl6 小时前
H5唤起app前端实现方案
前端
heimeiyingwang6 小时前
【架构实战】SQL注入与XSS防御:常见Web漏洞的系统性修复
前端·sql·架构