我正在做一个简单的项目.除了<Image source=''/>之外,几乎所有的功能都能很好地使用它.该图像在android studio和genymotion提供的android emulator中显示良好,但在任何真实设备(moto G3 turbo、nexus 5、galaxy s4等)上都不起作用.我不知道我的代码出了什么问题.这是我的密码

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

class ImageTester extends Component {
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          Welcome to React Native!
        </Text>
        <Text style={styles.instructions}>
          To get started, edit index.android.js
        </Text>
        <Text style={styles.instructions}>
          Double tap R on your keyboard to reload,{'\n'}
          Shake or press menu button for dev menu
        </Text>
        <Image source={require('./img/first_image.png')}></Image>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
});

AppRegistry.registerComponent('ImageTester', () => ImageTester);

项目 struct :

enter image description here

react 本机版本:react 本机:0.32.1

推荐答案

问题是我的包打包命令.正如@luwu在他的 comments 中所说,我查了this,惊讶地发现这和我的没有区别.然后,只有我在运行命令时注意到一条消息

"未设置assets资源 目标文件夹,正在跳过…"

这个消息有点让人困惑,因为包已经在assets资源 文件夹中创建了.消息中的"assets资源 "实际上表示我的图像.我用以下命令解决了问题:

react-native bundle --platform android --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --dev false --reset-cache --assets-dest android/app/src/main/res/

React-native相关问答推荐

莫迪德不会停留在屏幕中央

构建 iOS Expo 应用时出现 React-Native xcodebuild 错误 65

按下按钮有一个borderRadius

如何实时从 react-native-camera 获取帧

如何将抖动动画添加到视图(react-native)?

react-native:如何在离线模式下在模拟器上运行应用程序?

从堆栈导航器中删除屏幕

redux saga 的delay延迟功能不起作用

如何在react native应用程序名称中添加空格?

try 添加包时出现错误duplicate entry:com/google/android/gms/internal/zzble.class

React-Native: measure测量一个视图

Rich ReactNative TextInput

SyntaxError:Strict mode does not allow function declarations in a lexically nested statement on a newly created app

react-native run-android 构建错误':app:generateDebugBuildConfig'

在 React Native 中,如何使用浅渲染测试我的组件?

React.createClass vs. ES6 箭头函数

如何在android studio中导入react native元素

react-native-webview :对于 iOS 文本太小

如何在 Android 手机上运行 React Native 应用程序

键盘可见时无法单击按钮