javascript - React Native 中除图像外的顶部底部文本

Question

我目前正在尝试在本机反应中编写除图像之外的上部和底部文本与此类似：

[图1]歌曲名称

[图一] 歌名

但我得到这样的东西：

[图一] 歌名 歌名

歌曲的标题和名称应该在标题和副标题等图像之外。我尝试了很多方法，包括制作子文本组件，但没有成功。下面是我的代码的娱乐，供您参考：

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

export default class DisplayAnImage extends Component {
  render() {
    return (
      <Text>
        <Image
          style={{width: 50, height: 50}}
          source={require('@expo/snack-static/react-native-logo.png')}
        />
        <Text> Song Name </Text>
        <Text> Song Title </Text>
      </Text>
    );
  }
}

标签： javascripthtmlimagereact-nativetext

Answer 1

<View style={{ flexDirection: 'row' }}>
    <Image style={{ width: 50, height: 50}} source={require('@expo/snack-static/react-native-logo.png')}
    <View style={{justifyContent: 'center'}}>
        <Text>this is heading</Text>
        <Text>this is subheading</Text>
   </View>
</View>

试试这个造型