Javascript 正确显示在React Native中使用文本numberOfLines道具时显示更多/更少

我希望使用React Native中的comp及其道具

numberOfLines

，根据文本的内容长度正确显示show/hide

目前，我已经尝试过这样的smth，但它没有按预期工作：

const postTextContent = (props) => {
const [textShown, setTextShown] = useState(false); //To show ur remaining Text
const [lengthMore,setLengthMore] = useState(false); //to show the "Read more & Less Line"
const toggleNumberOfLines = () => { //To toggle the show text or hide it
    setTextShown(!textShown);
}

const onTextLayout = useCallback(e =>{
    setLengthMore(e.nativeEvent.lines.length >=3);
},[]);
    
  return (
      <View style={styles.mainContainer}>
          <Text
              onTextLayout={onTextLayout}
              numberOfLines={textShown ? undefined : 3}
              style={{ lineHeight: 21 }}>{Your Long Text}</Text>

              {
                  lengthMore ? <Text
                  onPress={toggleNumberOfLines}
                  style={{ lineHeight: 21, marginTop: 10 }}>{textShown ? 'Read less...' : 'Read more...'}</Text>
                  :null
              }
      </View>
  )
}

const postTextContent=（道具）=>{
const[textShowed，settextShowed]=useState（false）；//显示剩余文本
const[lengthMore，setLengthMore]=useState（false）；//显示“读取更多和更少行”
const toggleNumberOfLines=（）=>{//切换显示文本或隐藏文本
SettextShowed（！textShowed）；
}
const onTextLayout=useCallback（e=>{
setLengthMore（e.nativeEvent.lines.length>=3）；
},[]);
返回(
{你的长文本}
{
lengthMore？{textShowed？'Read less…'：'Read more…'}
：null
}
)
}

上面的问题是，当文本等于3行时，Read More text（阅读更多文本）会显示，这是不应该的，因为没有超过3行的文本

你知道如何处理这种情况吗