u-view.vue 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. <template>
  2. <view
  3. class="u-view" :class="class" :style="{
  4. backgroundColor: backgroundColor,
  5. color: color,
  6. flexDirection: flexDirection,
  7. justifyContent: justifyContent,
  8. alignItems: alignItems,
  9. flex1: flex1,
  10. width: width,
  11. height: height,
  12. padding: padding,
  13. margin: margin,
  14. borderColor: borderColor,
  15. }">
  16. </view>
  17. </template>
  18. <script>
  19. import { mpMixin } from '../../libs/mixin/mpMixin';
  20. import { mixin } from '../../libs/mixin/mixin';
  21. import { addStyle, addUnit, deepMerge } from '../../libs/function/index';
  22. /**
  23. * View 视图
  24. * @description 对View默认标签的封装
  25. * @tutorial https://ijry.github.io/uview-plus/components/view.html
  26. * @property {String} bgColor 背景颜色
  27. * @event {Function} click 点击触发事件
  28. * @example <up-view></up-view>
  29. */
  30. export default {
  31. name: 'up-view',
  32. // #ifdef MP
  33. mixins: [mpMixin, mixin],
  34. // #endif
  35. // #ifndef MP
  36. mixins: [mpMixin, mixin],
  37. // #endif
  38. emits: ['click'],
  39. computed: {
  40. valueStyle() {}
  41. },
  42. props: {
  43. backgroundColor: '',
  44. color: '',
  45. flexDirection: '',
  46. justifyContent: '',
  47. alignItems: '',
  48. flex1: '',
  49. width: '',
  50. height: '',
  51. padding: '',
  52. margin: '',
  53. borderColor: ''
  54. },
  55. data() {
  56. return {}
  57. },
  58. methods: {
  59. addStyle,
  60. clickHandler() {
  61. this.$emit('click')
  62. }
  63. }
  64. }
  65. </script>
  66. <style lang="scss" scoped>
  67. @import '../../libs/css/components.scss';
  68. .u-view {
  69. }
  70. </style>