index.vue 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. <template>
  2. <uni-shadow-root class="vant-grid-index"><view :class="'van-grid custom-class '+(border && !gutter ? 'van-hairline--top' : '')" :style="computed.rootStyle({ gutter })">
  3. <slot></slot>
  4. </view></uni-shadow-root>
  5. </template>
  6. <wxs src="./index.wxs" module="computed"></wxs>
  7. <script>
  8. global['__wxRoute'] = 'vant/grid/index'
  9. import { VantComponent } from '../common/component';
  10. import { useChildren } from '../common/relation';
  11. VantComponent({
  12. relation: useChildren('grid-item'),
  13. props: {
  14. square: {
  15. type: Boolean,
  16. observer: 'updateChildren',
  17. },
  18. gutter: {
  19. type: null,
  20. value: 0,
  21. observer: 'updateChildren',
  22. },
  23. clickable: {
  24. type: Boolean,
  25. observer: 'updateChildren',
  26. },
  27. columnNum: {
  28. type: Number,
  29. value: 4,
  30. observer: 'updateChildren',
  31. },
  32. center: {
  33. type: Boolean,
  34. value: true,
  35. observer: 'updateChildren',
  36. },
  37. border: {
  38. type: Boolean,
  39. value: true,
  40. observer: 'updateChildren',
  41. },
  42. direction: {
  43. type: String,
  44. observer: 'updateChildren',
  45. },
  46. iconSize: {
  47. type: String,
  48. observer: 'updateChildren',
  49. },
  50. reverse: {
  51. type: Boolean,
  52. value: false,
  53. observer: 'updateChildren',
  54. },
  55. },
  56. methods: {
  57. updateChildren() {
  58. this.children.forEach((child) => {
  59. child.updateStyle();
  60. });
  61. },
  62. },
  63. });
  64. export default global['__wxComponents']['vant/grid/index']
  65. </script>
  66. <style platform="mp-weixin">
  67. @import '../common/index.css';.van-grid{box-sizing:border-box;overflow:hidden;position:relative}
  68. </style>