无法从同级目录导入图像 - React Native

Question

我已经尝试了很多方法来摆脱这个问题。 我有一个名为Screens 的文件夹，其中有一个文件名HomeScreen.js

assets--
       |__ padlock.png
Screens--
        |__ HomeScreen.js

当我尝试将padlock.png 导入HomeScreen.js 时，会出现以下错误。

无法从 D:\User\react\myproject\Screens\HomeScreen.js 解析模块 ./assets/padlock.png：

我在HomeScreen.js尝试过的方法

const imageLock = require("../assets/padlock.png"); //Not working
const imageLock = { uri: "../assets/padlock.png" }; //Not Working
import imageLock from "../assets/padlock.png"; //not working

我已经确定padlock.png 存在并且我没有犯任何错误。完整的错误信息如下。

无法从 D:\User\react\myproject\Screens\HomeScreen.js 解析模块 ./assets/padlock.png：

这些文件都不存在：

• 挂锁.png
• 屏幕\资产\padlock.png\index(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native. js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json)
  27 | const imageLock = require("../assets/padlock.png"); | ^ 28 | 29 |导出默认功能 HomeScreen({ 导航 }) { 30 | const [modalOpen, setModalOpen] = useState(false);

Answer 1

你试过了吗

    <Image
      style={{ width: 100, height: 100 }}
      source={require('../assets/padlock.png')}
    />