如何将图像添加到 react-native-layout-grid？ Github 存储库中没有特别提到的道具

Question

我正在使用 react-native-layout-grid 包来显示网格布局。我想在网格布局中添加图像而不是 text/string。我该怎么做？

import React, { Component } from 'react';
import {
  Platform,
  StyleSheet,
  Text,
  View,
} from 'react-native';
import GridLayout from 'react-native-layout-grid';

export default class App extends Component<{}> {

  renderGridItem = (item) => (
    <View style={styles.item}>
      <View style={styles.flex} />
      <Text style={styles.name}>
        {item.name}
      </Text>
    </View>
  );

  render() {
    const items = [];
    for (let x = 1; x <= 30; x++) {
      items.push({
        name: `Grid ${x}`
      });
    }
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          Grid Layout
        </Text>
        <View style={styles.flex}>
          <GridLayout
            items={items}
            itemsPerRow={3}
            renderItem={this.renderGridItem}
          />
        </View>
      </View>
    );
  }
}

const styles = StyleSheet.create({
 ///styles///
});

我需要添加图像而不是将字符串文本传递到 props.Is，有什么办法可以做到吗？提前致谢。

Answer 1

在 renderGridItem 添加图片例如：---

 renderGridItem = (item) => (
    <View style={styles.item}>
      <View style={styles.flex} />
<Image
          style={{width: 50, height: 50}}
          source={{uri: 'https://facebook.github.io/react-native/docs/assets/favicon.png'}}
        />
      <Text style={styles.name}>
        {item.name}
      </Text>
    </View>
  );

正在工作，例如：https://snack.expo.io/@msbot01/petrified-tortillas

如何将图像添加到 react-native-layout-grid？ Github 存储库中没有特别提到的道具

How can i add images to the react-native-layout-grid? There are no props mentioned specifically in the Github repository

reactjs

react-native

react-native-android

react-native-ios

我需要添加图像而不是将字符串文本传递到 props.Is，有什么办法可以做到吗？提前致谢。