love.vue 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
  1. <template>
  2. <view class="center">
  3. <view v-for="(item,index) in list" :key="index" class="box" @click="nav(item.src)">
  4. <image :src="item.image"></image>
  5. <view class="font">{{ item.name }}</view>
  6. </view>
  7. </view>
  8. </template>
  9. <script>
  10. export default {
  11. data() {
  12. return {
  13. list: [
  14. {
  15. image: '/static/images/money.png',
  16. name: '爱心捐款',
  17. src: '/pages/applic/contribution'
  18. },
  19. {
  20. image: '/static/images/goods.png',
  21. name: '其他捐款捐物渠道',
  22. src: '/pages/applic/other'
  23. }
  24. ]
  25. }
  26. },
  27. methods: {
  28. nav(url) {
  29. uni.navigateTo({
  30. url:url,
  31. })
  32. }
  33. }
  34. }
  35. </script>
  36. <style lang="scss">
  37. page,.center{
  38. height: 100%;
  39. background: #F2F2F2;
  40. }
  41. .box {
  42. width: 90% ;
  43. height: 416rpx;
  44. margin: 26rpx auto;
  45. background: #FEFEFE;
  46. border-radius: 20rpx;
  47. box-shadow: 0 0 10rpx rgba($color: #999, $alpha: 0.9);
  48. image {
  49. width: 100%;
  50. height: 300rpx;
  51. }
  52. .font {
  53. margin-top: 30rpx;
  54. font-size: 34rpx;
  55. font-family: PingFang SC;
  56. font-weight: 500;
  57. color: #0E0E0E;
  58. padding-left: 28rpx;
  59. }
  60. }
  61. </style>