love.vue 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  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/index/aixin2.png',
  16. name: '爱心捐款',
  17. src: '/pages/applic/contribution'
  18. },
  19. {
  20. image: '/static/index/aixin3.jpg',
  21. name: '公益月捐',
  22. src: '/pages/index/ken'
  23. },
  24. {
  25. image: '/static/index/aixin1.png',
  26. name: '其他捐款捐物渠道',
  27. src: '/pages/applic/other'
  28. }
  29. ]
  30. }
  31. },
  32. methods: {
  33. nav(url) {
  34. // if(url == '/pages/applic/contribution') {
  35. // return this.$api.msg('功能建设中,敬请期待')
  36. // }
  37. uni.navigateTo({
  38. url:url,
  39. })
  40. }
  41. }
  42. }
  43. </script>
  44. <style lang="scss">
  45. page,.center{
  46. height: 100%;
  47. background: #F2F2F2;
  48. }
  49. .box {
  50. width: 90% ;
  51. height: 416rpx;
  52. margin: 26rpx auto;
  53. background: #FEFEFE;
  54. border-radius: 20rpx;
  55. box-shadow: 0 0 10rpx rgba($color: #999, $alpha: 0.9);
  56. image {
  57. width: 100%;
  58. height: 300rpx;
  59. }
  60. .font {
  61. margin-top: 30rpx;
  62. font-size: 34rpx;
  63. font-family: PingFang SC;
  64. font-weight: 500;
  65. color: #0E0E0E;
  66. padding-left: 28rpx;
  67. }
  68. }
  69. </style>