fs-swipe-action-group.vue 718 B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546
  1. <template>
  2. <view><slot></slot></view>
  3. </template>
  4. <script>
  5. /**
  6. * 滑动面板组件
  7. * @description 滑动面板组件
  8. * @property {Boolean} autoClose 是否自动关闭其他swipe按钮组
  9. */
  10. export default {
  11. name: 'fs-swipe-action-group'
  12. }
  13. </script>
  14. <script setup>
  15. import { provide, reactive } from 'vue'
  16. const props = defineProps({
  17. autoClose: {
  18. type: Boolean,
  19. default: true
  20. }
  21. })
  22. const state = reactive({
  23. children: []
  24. })
  25. const updateChildren = child => {
  26. state.children.push(child)
  27. }
  28. const toggle = () => {
  29. if (props.autoClose) {
  30. state.children.forEach(child => {
  31. child.updateState()
  32. })
  33. }
  34. }
  35. provide('swipeGroup', {
  36. updateChildren,
  37. toggle
  38. })
  39. </script>
  40. <style lang="scss" scoped></style>