Flexbox-混合省略号

Question

需要像下面这样设置行样式。标签以外的文本溢出在中间省略了。

标记种类需要附加到左侧的文本上。左右内容均应缩小以容纳标签名称。

[LongName...withEllipis][Tagname][LongText...withEllipis]
[ShortName][Tagname]         [LongText...alsoWithEllipis]
[ShortName][LongTagNameWithNoEllipsis]        [ShortText]

我尝试了以下代码。标签变得很小。

[LongName...withEllipis][][LongText...withEllipis]

<View style={{ flex: 1, flexDirection: 'row' }}>
    <View style={{ flex: 1, flexDirection: 'row' }}>
        <Text>{item.name}</Text>
        <View style={{flex: 1, flexShrink: 0}}>
            <Text>{item.tagName}</Text>
        </View>
    </View>
    <Text style={{ flex: 1, textAlign: 'right' }}>{item.location.name}</Text>
</View>