axious怎么把图片正常显示出来

Question

怎么样才能让图片显示正常 而不是字符串怎么样才能让图片显示正常 而不

Answer 1

引自免费微信小程序：皆我百晓生

为了使图片正常显示，你需要确保图片URL是有效的，并且在HTML中正确地引用它。根据提供的代码和信息，看起来你已经从服务器成功获取了图片的URL。接下来，你需要在模板中使用<img>标签来显示图片。

在books.vue文件中的<template>部分，找到适当的位置，将图片URL插入到<img>标签中。以下是修改后的代码示例：

<template>
  <div>
    <button @click="getmsg()">获取信息</button><br>
    <img :src="list.bigImgUrl" alt="Book Cover" width="200" height="200"><br> <!-- 添加这一行 -->
    {{list.title}}<br>
    {{list.slogan}}<br>
    作者：{{list.author}}&nbsp;出版社：{{list.bookConcern}}&nbsp;&nbsp;出版日期：{{list.publishDate}}<br>
    {{ $route.params.id}}<br>
  </div>
</template>

这里，我添加了一个新的<img>标签，设置了src属性为list.bigImgUrl，这样就会显示从服务器获取的图片。同时，我还添加了alt属性用于提供替代文本，以及width和height属性来设置图片大小，可以根据实际需求调整这些值。

现在，当getmsg()方法执行并成功获取数据后，图片应该会正常显示在页面上。如果仍然遇到问题，可能是因为服务器返回的URL无效或者图片资源本身存在问题。确保服务器返回的URL能直接在浏览器中打开并显示图片。