jQuery 기반 자동완성의 비추천 및 향후 제거

개발
1

$.autocomplete() 함수를 통해 호출되는 jQuery 기반 자동완성 라이브러리는 이제 Discourse 코어에서 **비추천(deprecated)**되었습니다. 자동완성 기능에 대해 더 나은 성능과 위치 지정 추상화를 제공하는 현대적인 솔루션으로 전환하고 있습니다.

마이그레이션 가이드

텍스트 영역 자동완성 (예: 멘션, 해시태그, 이모지)

DEV: floatkit autocomplete for d-editor - Pull Request #33513%EC%97%90%EC%84%9C - discourse/discourse - GitHub 도입된 DAutocomplete 모디파이어를 사용하세요.

이 모디파이어는 jQuery 플러그인과 동일한 기능을 제공하지만, Ember의 반응형 시스템 및 FloatKit 위치 지정 라이브러리와 더 잘 통합됩니다.

기타 참고 PR: DEV: floatkit autocomplete for ai-bot-conversations - Pull Request #34354 - discourse/discourse - GitHub

기존:

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

변경 후:

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

// 프로그래밍 방식:
DAutocompleteModifier.setupAutocomplete(
  owner,
  textareaElement,
  autocompleteHandler,
  {
    key: "@",
    dataSource: (term) => searchUsers(term),
    template: userTemplate,
    transformComplete: (user) => user.username
  }
);

입력 필드 자동완성 (예: 그룹/사용자 선택)

UX: overhaul of GroupSelector with Floatkit - Pull Request #34685%EC%97%90%EC%84%9C - discourse/discourse - GitHub 시연된 DMultiSelect 컴포넌트를 사용하세요.

이 컴포넌트는 검색 및 선택 관리를 포함하는 완전한 멀티셀렉트 경험을 제공합니다. 참고 PR의 구현에서는 단일 선택 모드도 지원합니다.

기존:

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

변경 후:

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>

jQuery 자동완성을 사용하는 테마나 플러그인을 유지 관리하고 있다면, 새로운 솔루션으로 마이그레이션해 주세요. 2025년 11월 10일에 해당 비추천 사항을 제거할 예정입니다.

코드 마이그레이션에 대해 질문이 있다면 아래에 댓글을 남겨 주세요.

7개의 좋아요
Locations Plugin :earth_africa: