Nativescript-Vue -- 本地映像路径不起作用

Question

In myApp.vue

<template>
<Page class="page">       
<ActionBar title="my-app" class="top-nav" />
<ListView v-show="showHome" for="(post, index) in posts" @itemTap="onItemTap" row="1">
<v-template>
<FlexboxLayout flexDirection="row" class="post-list" justifyContent="space-between">
<FlexboxLayout flexDirection="column" width="15%" justifyContent="space-between" alignItems="center">
<Image src="~/images/up.png" @tap="onButtonTap('up', index)" class="up-down" />
<Label :text="post.score" class="post-count" />
<Image src="~/images/down.png" @tap="onButtonTap('down', index)" class="up-down" />
</FlexboxLayout>
</v-template>
</ListView>
</Page>
</template>

它在Nativescript Playground上运行得很好，<Image />确实出现了src

但是当我使用 iOS 模拟器在机器上调试时，它不起作用......，<Image />部分只是一个空白......

项目框架如下所示

/app
|_ app.js
|_ app.css
|_ package.json
|_ /components
|   |_App.vue
|
|_ /images
|_up.png

有人知道发生了什么吗？谢谢。

Answer 1

在 NativeScript-Vue 应用程序中，使用我们的 vue-cli 模板的预期文件夹结构是将图像放在资产文件夹中。你能试一试吗？因此，将.png文件放在应用程序/资产/图像中。