reactnative: ellipsize iş alamıyorum

Question

Tepkisel uygulamamdaki bir metni kırpmaya çalışıyorum. "EllipsizeMode" özelliğini kullanmaya karar verdim, ancak işe yaramayacağım.

'use strict'; 

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


export class EllipsizeModeTest extends Component { 
    render() { 
     return (
      <View style={styles.container}> 
       <Text style={styles.text}>{'first part | '}</Text> 
       <Text style={styles.text} numberOfLines={1} ellipsizeMode={'tail'}> 
        {'a text too long to be displayed on the screen'} 
       </Text> 
      </View> 
     ); 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
     flexDirection: 'row', 
    }, 
    text: { 
     fontSize: 20, 
    } 
}); 

Şimdi metin kesilmiş almaz, neden bir fikrin:

Sorunun bir demo yazdı?

Answer 1

ellipsizeMode bir dize (süslü parantez kaldırın) atama deneyin:

<Text style={styles.text} numberOfLines={1} ellipsizeMode='tail'> 

Answer 2

Ben aynı problem vardı bileşeni

'use strict'; 

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


export class EllipsizeModeTest extends Component { 
    render() { 
     return (
      <View style={styles.container}> 
       <Text style={styles.text}>{'first part | '}</Text> 
       <Text style={styles.text} numberOfLines={1} ellipsizeMode={'tail'}> 
        {'a text too long to be displayed on the screen'} 
       </Text> 
      </View> 
     ); 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
     flexDirection: 'row', 
    }, 
    text: { 
     fontSize: 20, 
     width: 100 
    } 
}); 

Answer 3

bir genişlik stil özelliğini ayarlamayı deneyin, şey var yeter öğenin boyutu bir değere bağlı. Yani genişliği tanımlarsanız veya esnek bir değer eklerseniz işe yarayacaktır.

<View style={{width: 200}}><Text ellipsizeMode='tail' numberOfLines={1}></View>