Nativescript vue图像不炫耀答案

【问题标题】：Nativescript vue image not showing offNativescript vue图像不炫耀
【发布时间】：2019-09-15 11:34:31
【问题描述】：

为什么我的图片不显示？

标签正确显示网址但图片未显示。为什么不显示？需要添加一些东西吗？它以前工作过。如果我像这样添加带有 src 纯文本的普通图像，则会显示

  <StackLayout>
    <Button text="Make new screensot" />  
    <Button text="Load images" @tap="loadImages()" />
    <Label v-if="!loadedImages" text="Not loaded images" textWrap="true" />


     <RadListView v-else for="(item,index) in imagesS"
               itemHeight="100">
    <v-template>
      <StackLayout orientation="vertical">
        <Label :text="item.url"></Label>
        <Image :src="item.url" stretch="aspectFill" class="screenshots" />
      </StackLayout>
    </v-template>
  </RadListView>

   <ActivityIndicator class="activity-indicator" :busy="indicatorS"></ActivityIndicator>



  </StackLayout>

我添加了 css 但也无法正常工作

 .screenshots{
    height:100;
    width:100;
  }

方法

methods: {

  loadImages() {
    console.log('starting loading images');
     this.indicatorS = true;
    axios.get(this.jsonUsers + this.ID + '/images')
    .then((response) => {

          const imgCount = response.data.length;
          console.log("count- " + imgCount)

          var imagesArr = response.data;

          console.dir("images - " + response.data[0].url)


          this.$store.commit('setImages',imagesArr);
          console.log('images fully loaded');  
          this.$store.commit('setLoadedImages');
          this.indicatorS = false;

    })

  } 

 }

app

【问题讨论】：

你可以创建一个游乐场吗？ play.nativescript.org/?template=play-vue

标签： vue.js nativescript

【解决方案1】：

我在操场上试过这个。 https://play.nativescript.org/?template=play-vue&id=aKZ2wm.

我认为您使用的 URL 并不是真正用于图像的。https://imgur.com/a/AkEg8vy 这就是您使用的，它不是图像的 URL，而是网页的 URL。

现在，如果我转到页面并获取图像 URL https://i.imgur.com/78j1SJr.jpg。它工作正常。

【讨论】：