Question

图像存储在我的根文件夹中的文件夹中：

-myProject
   - images
      - backgroundImage.png
      - logo.png
   - index.android.js
   - MainView.js

当我在我的设备上运行应用时，图像只是不会显示出来。但该应用程序按预期运行。

我指的是这样的图像：

var ListBackground = require('./images/table_bg.png');
.
.
class List extends Component {
.
.
 <Image source={ListBackground} style={styles.listBackground}>
.
.
}

知道为什么会这样吗？我看到了一个名为webpack的东西（对不起，对JS来说是新手），他们引用像require('image!ListBackground');这样的图像，我可以在网上找到很多关于如何在react-native使用它的内容。想法？

Answer 1

这里可能会发生一些事情：首先，可能是由于路径问题导致您的图像无法找到（尽管在运行代码时您应该会遇到错误，如果这样做的话案件）。想到的另一个原因是你没有为图像定义宽度和高度（或基于flex的东西）。你能发贴你的样式声明吗？第三个原因是Android中的图像（或者至少曾经）在尺寸方面有点棘手（我记得例如必须通过道具而不是样式按顺序设置图像的宽度和高度使var diameter: Measurement<UnitLength> = Measurement<UnitLength>( value: 13, unit: .inches) let diameterFormatter = MeasurementFormatter() diameterFormatter.unitStyle = .medium diameterFormatter.unitOptions = .providedUnit // .natural diameterFormatter.numberFormatter.generatesDecimalNumbers = true diameterFormatter.numberFormatter.maximumFractionDigits = 1 // Get the formatted text for the value and the units let diameterText = diameterFormatter.getFormattedValueAndUnitFromMeasurement( measurement: diameter ) extension MeasurementFormatter { func getFormattedValueAndUnitFromMeasurement( measurement: Measurement<Unit> ) -> ( valueString: String, unitString: String) { // Number Formatter let numberFormatter = self.numberFormatter // This assumes the number is going to be displayed in the provided units. Ok for now let numberString = numberFormatter?.string( from: NSNumber (value: measurement.value) ) // Figure out just the units of the string var units: String = self.string( for: measurement)! if ( units.hasPrefix(numberString!) ) { units.removeSubrange((numberString?.startIndex)! ..< (numberString?.index((numberString?.startIndex)!, offsetBy: (numberString?.characters.count)! ))!) } return ( numberString!, units) } }工作。

Answer 2

使用：

source={require('./images/table_bg.png')}

图像不会在设备上以原生的方式呈现

2 个答案: