jQuery驱动的自动完成功能现已弃用

开发
1

The jQuery-based autocomplete library called via the $.autocomplete() function is now deprecated in Discourse core. We’re moving toward modern solutions that provide better performance & positioning abstractions for autocomplete functionality.

Migration Guide

For textarea autocomplete (e.g., mentions, hashtags, emoji)

Use the DAutocomplete modifier introduced in DEV: floatkit autocomplete for d-editor by tyb-talks · Pull Request #33513 · discourse/discourse · GitHub.

The modifier provides the same functionality as the jQuery plugin but with better integration into Ember’s reactivity system and our FloatKit positioning library.

Other reference PRs: DEV: floatkit autocomplete for ai-bot-conversations by tyb-talks · Pull Request #34354 · discourse/discourse · GitHub

Before:

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

After:

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

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

For input field autocomplete (e.g., group/user selection)

Use the DMultiSelect component as demonstrated in UX: overhaul of GroupSelector with Floatkit by tyb-talks · Pull Request #34685 · discourse/discourse · GitHub.

This component provides a complete multi-select experience with search and selection management. The implementation in the reference PR also accommodates for a single-select mode.

Before:

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

After:

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>

If you maintain a theme or plugin using the jQuery autocomplete, please migrate to the new solutions. We will be resolving the deprecation towards November 2025.

Reply below if you have questions about migrating your code.

5 个赞