我想实现点击相应图片进入一个详情页然后显示相关信息,但是控制台输出了这个错误
前端页面图片也加载不出来了(下面是图1)
详情页的图片也是(下面是图2)
前端的详情页代码是这样的,在homepage里我用temnplate模板输出图1,原本是能显示封面图的。然后点击相应的图片执行Controller跳转页面并把对象传给前端。
<script type="text/html" id="tpl">
<a href="/illustration/{{illustrationId}}">
<div class="illustration">
<figure class="figure">
<img src="{{cover}}" class="figure-img img-fluid rounded" alt="...">
</figure>
<figcaption class="figure-caption">
作者:{{author}}
<p class="card-text"><small class="text-muted">上传时间:{{createTime}}</small></p>
<span class="heart-icon" style="position: absolute; bottom: 0px; right: 20px;">
<i class="bi-heart-fill" style="font-size: 15px; color: #F06292"></i>
<span style="font-size: 15px;">{{evaluationQuantity}}</span>
</span>
</figcaption>
</div>
</a>
</script>
这是跳转的详情页,在这里用el表达式输出内容
<div class="card" style="position: relative;">
<div class="card-body">
<h5 class="card-title">${illustration.illustrationName}</h5>
<p class="card-text">作者:${illustration.author}</p>
<p class="card-text"><small class="text-muted">上传时间:${illustration.createTime?string('yyyy-MM-dd-HH-mm-ss')}</small></p>
</div>
<span class="heart-icon" style="position: absolute; top: 20px; right: 20px;">
<i class="bi-heart-fill" style="font-size: 25px; color: #F06292"></i>
<span style="font-size: 25px;">${illustration.evaluationQuantity}</span>
</span>
<img src="${illustration.cover}" class="card-img-bottom" alt="...">
</div>
相关的实体类对应数据库表
这是实体类
package org.person.qingtuku.entity;
import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.annotation.TableField;
import com.baomidou.mybatisplus.annotation.TableId;
import com.baomidou.mybatisplus.annotation.TableName;
import com.fasterxml.jackson.annotation.JsonFormat;
import org.springframework.format.annotation.DateTimeFormat;
import java.util.Date;
@TableName("illustration")
public class Illustration {
@TableId(type = IdType.AUTO)
@TableField("illustration_id")
private Long illustrationId;
@TableField("illustration_name")
private String illustrationName;
@TableField("author")
private String author;
@TableField("cover")
private String cover;
@TableField("evaluation_quantity")
private Integer evaluationQuantity;
@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss",timezone = "GMT+8")
@DateTimeFormat(pattern = "yyyy-MM-dd HH:mm:ss")
@TableField("create_time")
private Date createTime;
@TableField("description")
private String description;
public String getDescription() {
return description;
}
public void setDescription(String description) {
this.description = description;
}
public Long getIllustrationId() {
return illustrationId;
}
public void setIllustrationId(Long illustrationId) {
this.illustrationId = illustrationId;
}
public String getIllustrationName() {
return illustrationName;
}
public void setIllustrationName(String illustrationName) {
this.illustrationName = illustrationName;
}
public String getAuthor() {
return author;
}
public void setAuthor(String author) {
this.author = author;
}
public String getCover() {
return cover;
}
public void setCover(String cover) {
this.cover = cover;
}
public Integer getEvaluationQuantity() {
return evaluationQuantity;
}
public void setEvaluationQuantity(Integer evaluationQuantity) {
this.evaluationQuantity = evaluationQuantity;
}
public Date getCreateTime() {
return createTime;
}
public void setCreateTime(Date createTime) {
this.createTime = createTime;
}
}
这是Controller
@GetMapping("/illustration/{id}")
public ModelAndView showIllustration(@PathVariable("id") Long id) {
Illustration illustration = illustrationService.selectIllustration(id);
List<Evaluation> evaluationList = evaluationService.selectByIllustrationId(id);
ModelAndView mav = new ModelAndView("/illustration");
mav.addObject("illustration", illustration);
mav.addObject("evaluationList", evaluationList);
return mav;
}
下面是用到的两个service
@Override
@Transactional(propagation = Propagation.NOT_SUPPORTED,readOnly = true)
public Illustration selectIllustration(Long illustrationId) {
Illustration illustration = illustrationMapper.selectById(illustrationId);
return illustration;
}
@Override
public List<Evaluation> selectByIllustrationId(Long illustrationId) {
Illustration illustration = illustrationMapper.selectById(illustrationId);
QueryWrapper<Evaluation> queryWrapper = new QueryWrapper<Evaluation>();
queryWrapper.eq("illustration_id", illustrationId);
queryWrapper.orderByDesc("create_time");
List<Evaluation> evaluationList = evaluationMapper.selectList(queryWrapper);
for (Evaluation eva : evaluationList) {
User user = userMapper.selectById(eva.getUserId());
eva.setUser(user);
eva.setIllustration(illustration);
}
return evaluationList;
}
不知道问题出在哪里