Как получить окно поиска в `CommandBar` после обновления до Fabric 6

Question

Я обновил Fabric до версии 6.6.1 и заметил, что свойство isSearchBoxVisible отсутствует в CommandBar компоненте.

Как его заменить?Я широко использую его в своем приложении.

Answer 1

Насколько я знаю, вы можете использовать onRender свойство IContextualMenuItem.Я использую его для отображения пользовательского элемента управления в моей панели команд:

const items: IContextualMenuItem[] = [];

items.push({
    key: "ArchivedToggle",
    name: "Archived Toggle",
    onRender: this.renderArchivedToggle.bind(this),
});

В функции рендеринга:

<CommandBar
    className={styles.actionBar}
    items={[]}
    farItems={items}
/>

В пользовательской функции рендеринга вы можете в основном создавать все, что захотите.В данном случае это Toggle, но вы также можете заменить его на SearchBox.

private renderArchivedToggle() {
    <Toggle
        defaultChecked={props.defaultChecked}
        label=""
        onText={(_spPageContextInfo.currentLanguage === Language.DUTCH) ? "Archief" : "Archive"}
        offText={(_spPageContextInfo.currentLanguage === Language.DUTCH) ? "Archief" : "Archive"}
        onChanged={(value: boolean) => props.updateValueHandler(value)}
    />
}

Результат: