Блог

Я пытаюсь создать оболочку вокруг select2, которая может либо принимать URL-адрес, либо массив, содержащий данные. Если я передам данные оболочке, то я хочу отключить запуск запросов ajax после каждой введенной буквы.

Как я могу настроить это поведение, если данные передаются, а затем отключить ajax-запросы (без необходимости копировать код и указывать if)

В основном следующий код

   SelectTwo.init = (el, text, url, data = []) ->
    @_url = url
    @_data = data

    el.select2
      placeholder: text
      minimumInputLength: 2
      data: @_data
      ajax:
        url: (term) =>
          @_url   '/'   term
        dataType: "json"
        results: (data, page) ->
          results: data
  

Аргумент el.select2 является объектом options, он не обязательно должен быть объектным литералом, просто object . Это означает, что вы можете создавать объект по частям на основе аргументов init .

Вы могли бы сделать что-то вроде этого:

 SelectTwo.init = (el, text, data_source = { }) ->
  select_opts =
    placeholder: text
    minimumInputLength: 2

  if(data_source.url)
    select_opts.ajax =
      url: (term) -> "#{data_source.url}/#{encodeURIComponent(term)}"
      dataType: "json"
      results: (data, page) ->
        results: data
  else if(data_source.data)
    select_opts.data = data_source.data
  else
    # handle this however you want

  el.select2 select_opts
  

Некоторые интересные моменты:

1. Я добавил encodeURIComponent оболочку вокруг поискового запроса, потому что я параноик, и это хорошая привычка.
2. Я переключаюсь на интерполяцию строк для построения URL-адреса поиска, поскольку это для меня понятнее, чем куча символов и кавычек.
3. Больше нет необходимости связывать url функцию AJAX с => .
4. Вообще нет необходимости в каких-либо переменных экземпляра (если, конечно, что-то не происходит в другом месте).

5. Я переключил аргументы на init , чтобы указать URL-адрес или массив данных в объекте, чтобы вы могли сказать:

    SelectTwo.init(el, 'pancakes', url: '...')
   SelectTwo.init(el, 'pancakes', data: [ ... ])
     

   вместо (IMO) более громоздкого:

    SelectTwo.init(el, 'pancakes', '...')
   SelectTwo.init(el, 'pancakes', undefined, [ ... ])
     

   Я нахожу, что позиционные аргументы становятся уродливыми, если их больше пары, вдвойне, когда есть необязательные аргументы, которые подавляют предыдущие необязательные аргументы.