React-Native <Text> 省略最后一个字符

Question

每当我在元素中放入超过 5 个字符的字符串时，最后一个不会呈现。这是我的代码和输出的字符串。

const Header = () => {
    const { textStyles, viewStyles } = styles;

    return (
        <View style={viewStyles}>
            <Text style={textStyles}>Albums</Text>        
        </View>
    );
};

const styles = {
    viewStyles: {
        backgroundColor: '#F8F8F8',
        alignItems: 'center',
        justifyContent: 'center',
        height: 60,
        paddingTop: 15,
        shadowColor: '#000',
        shadowOffset: { width: 0, height: 2 },
        elevation: 2
    },
    textStyles: {
        fontSize: 20
    },
};

输出字符串： Album

如果我更改文本元素像里面的字符串'Albums!'，输出将是Albums。它总是显示 n-1 个字符。

Answer 1

我测试了你的代码伙计它工作正常

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';

const Header = () => {
  const { textStyles, viewStyles } = styles;

  return (
      <View style={viewStyles}>
          <Text style={textStyles}>Albums!!!!</Text>
      </View>
  );
};
export default class App extends React.Component {

  render() {
    return (
      <View>
        <Header></Header>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  viewStyles: {
        backgroundColor: '#F8F8F8',
        alignItems: 'center',
        justifyContent: 'center',
        height: 60,
        paddingTop: 15,
        shadowColor: '#000',
        shadowOffset: { width: 0, height: 2 },
        elevation: 2
    },
    textStyles: {
        fontSize: 20
    },
});

这是输出