Il completamento automatico basato su jQuery è ora deprecato

Sviluppatore
1

La libreria di completamento automatico basata su jQuery chiamata tramite la funzione $.autocomplete() è ora deprecata nel core di Discourse. Ci stiamo muovendo verso soluzioni moderne che offrono migliori prestazioni e astrazioni di posizionamento per la funzionalità di completamento automatico.

Guida alla migrazione

Per il completamento automatico nell’area di testo (ad es. menzioni, hashtag, emoji)

Utilizzare il modificatore DAutocomplete introdotto in https://github.com/discourse/discourse/pull/33513.

Il modificatore fornisce la stessa funzionalità del plugin jQuery ma con una migliore integrazione nel sistema di reattività di Ember e nella nostra libreria di posizionamento FloatKit.

Altri PR di riferimento: DEV: floatkit autocomplete for ai-bot-conversations by tyb-talks · Pull Request #34354 · discourse/discourse · GitHub

Prima:

$(textarea).autocomplete({
  key: "@",
  dataSource: (term) => searchUsers(term),
  template: userTemplate,
  transformComplete: (user) => user.username
});

Dopo:

import DAutocompleteModifier from "discourse/modifiers/d-autocomplete";

// programmaticamente:
DAutocompleteModifier.setupAutocomplete(
  owner,
  textareaElement,
  autocompleteHandler,
  {
    key: "@",
    dataSource: (term) => searchUsers(term),
    template: userTemplate,
    transformComplete: (user) => user.username
  }
);

Per il completamento automatico nei campi di input (ad es. selezione di gruppi/utenti)

Utilizzare il componente DMultiSelect come dimostrato in UX: overhaul of GroupSelector with Floatkit by tyb-talks · Pull Request #34685 · discourse/discourse · GitHub.

Questo componente fornisce un’esperienza completa di multi-selezione con gestione della ricerca e della selezione. L’implementazione nel PR di riferimento accoglie anche una modalità di selezione singola.

Prima:

$("input.group-selector").autocomplete({
  dataSource: (term) => searchGroups(term),
  template: groupTemplate
});

Dopo:

import DMultiSelect from "discourse/components/d-multi-select";

<DMultiSelect
  @selection={{this.selectedGroups}}
  @loadFn={{this.searchGroups}}
  @onChange={{this.handleChange}}
  @label="Select groups"
>
  <:selection as |group|>
    {{group.name}}
  </:selection>
  <:result as |group|>
    {{group.name}}
  </:result>
</DMultiSelect>

Se mantieni un tema o un plugin che utilizza il completamento automatico jQuery, ti preghiamo di migrare alle nuove soluzioni. Risolveremo la deprecazione il 10 novembre 2025.

Rispondi qui sotto se hai domande sulla migrazione del tuo codice.

6 Mi Piace