You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
47 lines
1014 B
47 lines
1014 B
<template> |
|
<el-button @click="backHandle" type="success">返回</el-button> |
|
<div style="margin-top: 20px;margin-left: 50px;margin-right: 50px"> |
|
<p class="list-title">{{ data.title }}</p> |
|
<p class="list-summary">{{ data.summary }}</p> |
|
<div class="center-image"> |
|
<img class="list-image" :src="data.imageUrl" alt="News Image"> |
|
</div> |
|
<p class="list-time">{{ data.date }}</p> |
|
</div> |
|
</template> |
|
<script setup lang="ts"> |
|
import {ref} from 'vue'; |
|
import {useRoute, useRouter} from "vue-router"; |
|
const router = useRouter(); |
|
const route = useRoute(); |
|
const backHandle = ()=>{ |
|
router.go(-1); |
|
} |
|
const data = ref(route.query) |
|
</script> |
|
|
|
<style scoped> |
|
.list-title{ |
|
font-size: 25px; |
|
font-weight: 600; |
|
} |
|
.list-summary{ |
|
font-size: 20px; |
|
color: #8c8b8b; |
|
margin-top: 10px; |
|
} |
|
.list-time{ |
|
font-size: 16px; |
|
color: #999999; |
|
margin-top: 10px; |
|
} |
|
.center-image{ |
|
display: flex; |
|
justify-content: center; |
|
margin-top: 20px; |
|
} |
|
.list-image{ |
|
width: 500px; |
|
margin-top: 20px; |
|
} |
|
</style> |