Текст метки не обновляется в MUIDataTable ReactJS

Question

Я хочу добавить многоязычную опцию в mui Datatables.Я могу изменить переводы, но когда я хочу изменить язык, я попытался дать другой объект с другими переводами (этот объект, если я делаю консольный журнал, я вижу изменения), но тексты меток не меняются.

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

Является ли компонент класса, поэтому я сделал статический contextType с правильным провайдером.

Есть ли возможность повторно визуализировать элемент с другими параметрами или чем-то в этом роде?

options = {
 textLabels: this.context.translation.dataTables.textLabels
};

return(
 <MUIDataTable
   title={this.context.language.value}
   data={data}
   columns={columns}
   options={options}
 />
);

Answer 1

Лучший подход для повторного рендеринга Mui-Datatables его обновление ключа таблицы

key = {this.context.language.value}

<MUIDataTable
   key={this.context.language.value}
   title={this.context.language.value}
   data={data}
   columns={columns}
   options={options}
 />

Answer 2

Вы можете форсировать рендеринг компонента React:

• Существует несколько способов форсирования рендеринга компонента React, но они по сути одинаковы.Первый использует this.forceUpdate(), который пропускает shouldComponentUpdate:

someMethod() {
    // Force rendering without state change...
    this.forceUpdate();
}

• Предполагая, что ваш компонент имеет состояние, вы также можете вызвать следующее:

someMethod() {
    // Force rendering with a simulated state change
    this.setState({ state: this.state });
}

Answer 3

использовать customRowRender Функция в опциях и манипулировать таблицей относительно языка

Переопределить рендеринг строки по умолчанию с помощью пользовательской функции.

customRowRender (data, dataIndex, rowIndex) => Реагировать с компонентом