plugins - How to place focus after opening dropdowns in slash command. have tried so many things - Stack Overflow

admin管理员组

文章数量:1122832

`_getPluginListItemsDefinitons() { const editor = this.editor; const locale = editor.locale;

    this._dropdown = createDropdown(locale);

    this._commandItems = [];
    const commandNames = ['bold','italic','underline','horizontalLine','bulletedList','numberedList','insertTable','codeBlock','paragraph','table','subscript','superscript','widgetBox'];

    commandNames.forEach((commandName) => {
        const command = editormands.get(commandName);
        if (command) {
            const buttonModel = {
                type: 'button',
                model: {
                    label: commandName.charAt(0).toUpperCase() + commandName.slice(1),
                    withText: true,
                    icon: icons[commandName] || icons.cog,
                    commandName: commandName,
                },
            };
            this._commandItems.push(buttonModel);
        }
    });

    this._commandItems.sort((a, b) => {
        return a.model.label.localeCompare(b.model.label);
    });

    this._addItemsToDropdown(this._commandItems);
    this._createCustomToClass();

    this._dropdown.isOpen = true;
    
    if(this._dropdown.isOpen === true){
        this._dropdown.render();
        this._dropdown.element.focus();
        this.focusTracker = new FocusTracker();
        this.focusTracker.isFocused();
        console.log("focus:", this.focusTracker);
        this.focusables = new ViewCollection();
        this.keystrokes = new KeystrokeHandler();
        this.focusCycler = new FocusCycler({
            focusables: this._commandItems,
            focusables: this._dropdown.element,
            focusables: this._dropdown.panelView,
            focusTracker: this.focusTracker,
            focusTracker: this._dropdown.panelView,
            keystrokeHandler: this.keystrokes,
            actions: {
                focusPrevious: ['arrowup'],
                focusNext: ['arrowdown']
            }
        });
    }
    this.listenTo(this._dropdown, 'execute', (evt, data) => {
        const commandName = evt.sourcemandName;
        if (commandName) {
            this.customExecution(commandName);
            if (!this._dropdown.isOpen) {
                editor.editing.view.focus();
            }
        }
        this._dropdown.isOpen = false;
        this.hideDropdown();
    });
}

The focus should change from the editor to dropdown panel after dropdown opened. it's not like user clicking the toolbar button and showing the dropdown. i am showing the dropdown after enter (.) special character.`

本文标签： pluginsHow to place focus after opening dropdowns in slash command have tried so many thingsStack Overflow