Есть ли простой способ использовать цвета темы в автореагирующих элементах

Question

Я пытаюсь использовать response-autosuggest, так как для меня сигнатура метода renderSuggestion должна содержать актуальную тему, чтобы мы могли использовать переменные из темы в нашем стиле

Вот мой обходной путь, но я просто хочу убедиться, что я не делаю что-то бесполезно сложное:

                                        <AutoSuggest
                                                renderSuggestion={createRenderSuggestion(this.props.classes)}
/>

переменная this.props.classes заполненапри создании компонента

withStyles(styles)(ShopSuggestBox)

я должен был определить метод внутри метода, чтобы получить доступ к актуальной теме

const createRenderSuggestion = theme => suggestion => {
    console.log("setting css of name:", theme.itemName)
    return (
            <div>
                <div className={theme.itemName}>
                    {suggestion.name}
                </div>
                <div className={theme.itemInfo}>
                    NYC
                </div>
            </div>
    )
}

Просто чтобы быть уверенным, чтобыть ясно: когда я пытаюсь получить доступ к теме в методе функция renderSuggestion (предложение, {запрос, isHighlighted}) я не могу

Answer 1

Взгляните на https://material -ui.com / customization / themes / # accessing-the-in-a-component .

Вы также можете использовать withStyles(styles, { withTheme: true })(ShopSuggestBox); если ты не хочешь сочинять.

В любом случае theme тогда будет доступно в твоих реквизитах ShopSuggestBox.