Изменить направление ag-grid на RTL - PullRequest
Новая
       9

Изменить направление ag-grid на RTL

0 голосов
/ 13 января 2020

Я использую ag-grid в реакции, и я хочу изменить направление на RTL, а также использовать локальный текст. На основании документации ag-grid enableRtl={true} изменит стиль сетки. Это верно, когда мы устанавливаем это постоянно, но когда я хочу изменить это программно, это не изменяется. Я передал переменную через реквизит компоненту для изменения направления и перевода текста. Это мой код 

 const Grid= ({dir}) =>{
  return (
    <div 
      className="ag-theme-balham"
      style={{ height: '100%', width: '100%' }} 
    >
      <AgGridReact
        defaultColDef={defaultColDef}
        columnDefs={column}
        rowData={rowData}
        enableRtl={dir === 'rtl'}
        localeTextFunc={(key, defaultValue) => {
          return dir === 'rtl' ? gridLocal[key] : defaultValue; 
        }}
      />
    </div>
  );
}

до изменения направления

после изменения направления

Как и должно быть

Я искал решение, но не могу найти способ его решить. Что мне делать? Что не так с моим кодом?

Редактировать: где я использовал компонент Grid 

const MainLayout = (props) => {
  const classes = useStyles();
  const theme = useTheme();
  const [open, setOpen] = useState(false);

  const handleDrawerOpen = () => { setOpen(true) };
  const handleDrawerClose = () => { setOpen(false) };

  return (
    <div >
      <Topbar 
        setLang={props.setLang}
        drawerOpen={handleDrawerOpen} 
        drawerClose={handleDrawerClose} 
        status={open}
        handleSignOut={props.handleSignOut}
      />
      <div style={{height:'48px'}}/>
      <div className={classes.content}>
        <Sidebar open={open} drawerClose={handleDrawerClose}/> 
        <Grid dir={theme.direction}/>
      </div>
    </div>
  );
}
...