производительность удаленного эл-выбрать вариант 3000 элементов медленно и раздавить?

Привет, это мой первый раз. У меня есть проблема с тем, что у меня 3000 элементов, и я использую такие фреймворки, как vue, element-ui и метеор. Я извлекаю все элементы через удаленный el-select, который добавляет дополнительные объекты массива удаленного выбора. Я не знаю, почему это снижает производительность и приводит к поломке.

Это моя фотография

// Метод поиска опций элемента

_getItemOpts(query, type) {
  type = type || 'remote'
  let exp = new RegExp(query)
  let selector = {}
  if (exp) {
    selector = {
      itemType: { $ne: 'Bundle' },
      // , 'Sale'
      activityType: { $in: ['Purchase'] },
      status: 'Active',
      $or: [
        { name: { $regex: exp, $options: 'i' } },
        { refNo: { $regex: exp, $options: 'i' } },
        { barcode: { $regex: exp, $options: 'i' } },
      ],
    }
  }

  // Find item
  findItems
    .callPromise({ selector: selector })
    .then(result => {
      // console.log(result)
      if (type == 'remote') {
        this.itemOpts = result          
      
      }
      this.loading = false
    })
    .catch(err => {
      this.loading = false
      Notify.error({ message: err })
    })
},

Помогите мне, пожалуйста.


person pannda na    schedule 30.12.2018    source источник
comment
Добро пожаловать в Stack Overflow. Можете ли вы предоставить дополнительную информацию об ошибках, которые вы получаете, и предоставленный код, это на стороне сервера или на стороне клиента?   -  person Mikkel    schedule 30.12.2018
comment
Из-за гораздо большего количества кода, поэтому я не могу отправить весь код, как описано выше, и вы можете увидеть ссылку на изображение.   -  person pannda na    schedule 30.12.2018
comment
Я рад помочь вам, но у меня недостаточно информации, чтобы продолжить. Вы можете прочитать stackoverflow.com/help/how-to-ask для объяснения. Если вы хотите поделиться со мной своим метеоритным проектом (и базой данных), это тоже сработает.   -  person Mikkel    schedule 30.12.2018


Ответы (1)


Ну никакой магии здесь нет. Вы пытаетесь добавить в DOM 3000 элементов, поэтому неудивительно, что он падает. Попробуйте сузить результаты, например, показывать их только тогда, когда пользователь вводит 3 буквы.

person webmint    schedule 30.12.2018
comment
посмотрите в element.eleme.io/#/en-US/ component/select#remote-search код здесь. в методе вы видите это if (query !== '') , поэтому попробуйте, например, с if (query.length ›= 3) - person webmint; 31.12.2018