Question

我正在使用native-base来显示Thumbnail源，但出现错误

Error: The <Image> component cannot contain children. If you want to render content on the top of the image, consider using the <ImageBackground> component or absolute positioning.

这是我尝试过的错误：

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

import { Card, CardItem, Thumbnail, Body, Left, Right, Button, Icon } from 'native-base';

class CardComponent extends Component {
    render() {
        return (
            <Card>
                <CardItem>
                    <Left>
                        <Thumbnail source={require('../assets/me.png')}>
                            <Body>
                                <Text>Username</Text>
                                <Text note>August 29, 2018</Text>
                            </Body>
                        </Thumbnail>
                    </Left>
                </CardItem>
            </Card>
        );
    }
}

Answer 1

尝试一下，这将为您服务。

<Card>
   <CardItem>
       <Left>
          <Thumbnail source={require('../assets/me.png')}/>
             <Body>
                 <Text>Username</Text>
                 <Text note>August 29, 2018</Text>
             </Body>
      </Left>
   </CardItem>
</Card>

Answer 2

使用<ImageBackground>标签将您的文本附加到图像上。

请参阅此ImageBackground

基于本机的缩略图不接受图像源

2 个答案: