virtual-select-menu.js 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. import baseComponent from '../helpers/baseComponent'
  2. import { nextTick } from '../helpers/hooks/useNativeAPI'
  3. import { POPUP_SELECTOR, getDefaultProps } from './utils'
  4. baseComponent({
  5. useExport: true,
  6. properties: {
  7. height: {
  8. type: Number,
  9. value: 270,
  10. },
  11. ...getDefaultProps(),
  12. },
  13. data: {
  14. startIndex: 0, // 第一个元素的索引值
  15. endIndex: -1, // 最后一个元素的索引值
  16. },
  17. observers: {
  18. options(options) {
  19. nextTick(() => this.renderVirtualList(options))
  20. },
  21. },
  22. methods: {
  23. onVirtualChange(e) {
  24. const { startIndex, endIndex } = e.detail
  25. if (
  26. this.data.startIndex !== startIndex ||
  27. this.data.endIndex !== endIndex
  28. ) {
  29. this.setData(e.detail)
  30. this.triggerEvent('virtualChange', { ...e.detail })
  31. }
  32. },
  33. renderVirtualList(options) {
  34. const virtualListRef = this.querySelector('#wux-virtual-list')
  35. if (virtualListRef) {
  36. virtualListRef.render(options)
  37. }
  38. },
  39. onValueChange(e) {
  40. const { max, multiple } = this.data
  41. const { selectedValue: value } = e.detail
  42. if (multiple && max >= 1 && max < value.length) { return }
  43. this.triggerEvent('selectChange', this.getValue(value))
  44. },
  45. getValue(value = this.data.value, cols = this.data.options) {
  46. this.picker = this.picker || this.querySelector(POPUP_SELECTOR)
  47. return this.picker && this.picker.getValue(value, cols)
  48. },
  49. expose() {
  50. const scrollToItem = (index) => {
  51. const list = this.querySelector('#wux-virtual-list')
  52. if (list) {
  53. return list.scrollToIndex(index)
  54. }
  55. }
  56. return {
  57. scrollToItem,
  58. getValue: this.getValue.bind(this),
  59. }
  60. },
  61. },
  62. ready() {
  63. const { options } = this.data
  64. nextTick(() => this.renderVirtualList(options))
  65. },
  66. })