UserInfoRowItem.vue 1017 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
  1. <template>
  2. <view @click="click" class="row_item" :class="{ arrow_right: arrow }">
  3. <view class="title">
  4. <text>{{ lable }}</text>
  5. </view>
  6. <view class="content">
  7. <text>{{ content }}</text>
  8. </view>
  9. <view class="right-content">
  10. <slot>
  11. </slot>
  12. <u-icon v-if="arrow" name="arrow-right" color="#999" size="15"></u-icon>
  13. </view>
  14. </view>
  15. </template>
  16. <script>
  17. export default {
  18. name: "",
  19. components: {},
  20. props: {
  21. lable: String,
  22. content: String,
  23. arrow: {
  24. type: Boolean,
  25. default: false,
  26. },
  27. },
  28. data() {
  29. return {};
  30. },
  31. methods: {
  32. click() {
  33. this.$emit("click");
  34. },
  35. },
  36. };
  37. </script>
  38. <style lang="scss" scoped>
  39. .row_item {
  40. @include vCenterBox();
  41. padding:0 24rpx;
  42. height: 98rpx;
  43. }
  44. .right-content {
  45. display: flex;
  46. align-items: center;
  47. justify-content: flex-end;
  48. gap: 12rpx;
  49. flex: 1;
  50. }
  51. .title {
  52. margin-right: 24rpx;
  53. color: #222222;
  54. }
  55. .arrow_right {
  56. justify-content: space-between;
  57. }
  58. </style>