React-native：“this.props.imageSource”问题答案

【问题标题】：React-native: ”this.props.imageSource" issueReact-native：“this.props.imageSource”问题
【发布时间】：2018-06-10 08:02:57
【问题描述】：

当我使用动态图像 src 并启动 NPM 时，我收到此错误：

TargetModuleName"."this.props.imageSource",:message":"无法解析模块...

但是当我输入 const URL 时，它可以正常工作。

这是我的代码：

import React, { Component } from 'react';

import { StyleSheet, Text, View, ScrollView, Image } from 'react-native';

import CustomImage from './CustomImage';

export default class ContentContainer extends React.Component {
  render() {
    return (
      <View style={styles.contentContainer}>

          <View style={styles.col2}>
              <CustomImage imageSource={'../img/shirts.jpg'} />
          </View>
          <View style={styles.col1}></View>
          <View style={styles.contentBanner}></View>

      </View>
    );
  }
}

//------------ CustomImage.js -----------------------
import React, { Component } from 'react';
import PropTypes from 'react';
import { StyleSheet,AppRegistry, Text, View, ScrollView, Image } from 'react-native';


export default class CustomImage extends React.Component {
  render() {
    return (
        <Image source={require('this.props.imageSource')} style={styles.Image} />


    );
  }
}

【问题讨论】：

标签： react-native npm rendering react-native-android imagesource

【解决方案1】：

首先你的语法不正确。它应该如下所示。

require(this.props.imageSource)

即使您修复了该语法，它也无法正常工作，因为本地图像源不能是动态的，因为它们需要在构建时进行编译。因为需要知道图片的这个路径。

您可以在 Image Documentation 上了解更多信息

【讨论】：