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.

textDetails.vue 1.3KB

1 년 전
1 년 전
1 년 전
1 년 전
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. <template>
  2. <view class="news-item" v-for="(item,index) in state.data" :key='index'>
  3. <view class="left-text">
  4. <view class="tit description">{{item.title}}</view>
  5. <view class="span">{{item.copywriting}}</view>
  6. </view>
  7. <view class="image-box">
  8. <image :src="fileURL + item.imgUrl"></image>
  9. </view>
  10. </view>
  11. </template>
  12. <script setup lang="ts">
  13. import { reactive } from "vue";
  14. import { onLoad } from "@dcloudio/uni-app";
  15. import { fileURL } from "@/datas/fileURL.js";
  16. const state = reactive({
  17. data: []
  18. })
  19. onLoad((option) => {
  20. const params = JSON.parse(decodeURIComponent(option.item))
  21. state.data.push(params)
  22. console.log("params", params)
  23. })
  24. </script>
  25. <style>
  26. page {
  27. background: #eef7f7;
  28. }
  29. </style>
  30. <style lang="scss" scoped>
  31. .news-item {
  32. display: flex;
  33. border: 1rpx solid #dcdcdc;
  34. padding: 40rpx;
  35. font-size: 30rpx;
  36. box-sizing: border-box;
  37. width: 90%;
  38. margin: 30rpx auto;
  39. background-color: white;
  40. }
  41. .image-box image {
  42. width: 100rpx;
  43. height: 100rpx;
  44. border-radius: 10rpx;
  45. }
  46. .news-item .span {
  47. font-size: 22rpx;
  48. display: inline-block;
  49. text-align: center;
  50. background: #bae0f1;
  51. border-radius: 6rpx;
  52. color: #0a8f8a;
  53. padding: 4rpx 8rpx;
  54. }
  55. .news-item .more {
  56. font-size: 24rpx;
  57. text-align: center;
  58. color: #0a8f8a;
  59. padding: 22rpx 0;
  60. }
  61. </style>