在同一行上对齐文本和图像React Native

Question

我正在尝试对齐包裹在React Native中文本元素中的文本和图像。

这是当前的样子：

我希望将其对齐，以使其均匀。

这是我当前拥有的代码：

<Text>
    <Text
        key={i}
        onPress={() => this.updateCurrentFilter(i)}
        style={{
            paddingLeft: 10,
            fontFamily: "Montserrat-Regular",
            fontSize: 12,
        }}
    >{v.filter_name}</Text>
    <Image
        source={require('../assets/outline_toggle_off_black_18dp.png')}
        style={{
            width: 25,
            height: 25,
            color: 'black',
            resizeMode: 'contain', 
        }}
    />
</Text>

Answer 1

类似的事情应该起作用。目前尚不清楚为什么将外部级别包装在Text字段而不是View

中

<Text>
    <View style={{flexDirection:'row', alignItems:'center'}}>
        <Text style={{....}}}>foo</Text>
        <Image ... />
    </View>
</Text>