setting.vue 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. <template>
  2. <view>
  3. <view class="card" v-for="(item,index) in menuList" :key="index" @click="jump(item.path)">
  4. <view style="display: flex;">
  5. <image style="width: 40rpx;height: 40rpx;" :src="item.icon" ></image>
  6. <view class="center">
  7. <text class="padding-left-10">{{item.name}}</text>
  8. </view>
  9. </view>
  10. <view class="">
  11. <text class="cuIcon-right"></text>
  12. </view>
  13. <button v-if="item.name=='官方客服'" hover-class="none" open-type="contact" show-message-card="true"></button>
  14. </view>
  15. </view>
  16. </template>
  17. <script>
  18. export default {
  19. data() {
  20. return {
  21. menuList:[
  22. {
  23. icon:'/static/setting/info.png',
  24. name:'个人资料',
  25. path:'/pages/mine/myInfo'
  26. },
  27. {
  28. icon:'/static/setting/kefu.png',
  29. name:'官方客服',
  30. path:''
  31. },
  32. {
  33. icon:'/static/setting/tousu.png',
  34. name:'投诉及反馈',
  35. path:'/pages/mine/setting/question'
  36. }
  37. ]
  38. }
  39. },
  40. methods: {
  41. jump(url){
  42. uni.navigateTo({
  43. url
  44. })
  45. }
  46. }
  47. }
  48. </script>
  49. <style lang="scss" scoped>
  50. .card{
  51. display: flex;
  52. justify-content: space-between;
  53. margin: 20rpx 0;
  54. padding: 30rpx;
  55. background-color: #FFFFFF;
  56. position: relative;
  57. button{
  58. position: absolute;
  59. top: 0;
  60. right: 0;
  61. bottom: 0;
  62. left: 0;
  63. background-color: transparent;
  64. }
  65. }
  66. </style>