list-item.vue 763 B

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. <template>
  2. <view class="bg-white my-1 p-2 item rounded-md overflow-hidden border border-light shadow-sm" @tap='onTapItem' >
  3. <slot name="title">
  4. <view class="font-weight-bold text-dark font-md">{{title}}</view>
  5. </slot>
  6. <slot name="subTitle">
  7. <view class="font-weight-bold text-muted font-md">{{subTitle}}</view>
  8. </slot>
  9. <view class="text-muted">
  10. <slot></slot>
  11. </view>
  12. </view>
  13. </template>
  14. <script>
  15. export default {
  16. props:{
  17. title:{
  18. type:String,
  19. default:""
  20. },
  21. subTitle:{
  22. type:String,
  23. default:""
  24. }
  25. },
  26. methods:{
  27. onTapItem () {
  28. this.$emit('click')
  29. }
  30. }
  31. }
  32. </script>
  33. <style scoped lang="scss">
  34. /* @import url("@/common/styles/free.css"); */
  35. .item{
  36. border-left:6px solid var(--info);
  37. }
  38. </style>