Я пытаюсь перейти с ExtJ на React.Как оказалось, это не очень легкий процесс.Потому что мне все еще нужны некоторые компоненты ExtJs в моих приложениях.
Поэтому я решил использовать ExtReact.Но я хочу использовать как можно меньше Ext и использовать Material-ui вместо того, где я могу.
Например, я хочу иметь возможность использовать компонент Material-ui и Component ExtReact в одном приложении.
Когда я пытаюсь это сделать, я получаю эту ошибку:
вот полный код компонента:
import React, { Component } from 'react';
import { ExtReact,Container } from '@sencha/ext-modern';
import AppBar from '@material-ui/core/AppBar';
import Toolbar from '@material-ui/core/Toolbar';
import Typography from '@material-ui/core/Typography';
import Button from '@material-ui/core/Button';
import IconButton from '@material-ui/core/IconButton';
import MenuIcon from '@material-ui/icons/Menu';
import { Grid, Column } from '@sencha/ext-modern';
Ext.require('Ext.plugin.Responsive');
export default class App extends Component {
store = Ext.create('Ext.data.Store', {
fields: ['name', 'email'],
data: [
{ name: 'Tim Smith', email: 'tim101@gmail.com' },
{ name: 'Jill Lindsey', email: 'jlindsey890@gmail.com' }
]
});
render() {
return (
<ExtReact>
<AppBar position="static">
<Toolbar>
<IconButton edge="start" color="inherit" aria-label="Menu">
<MenuIcon />
</IconButton>
<Typography variant="h6">
News
</Typography>
<Button color="inherit">Login</Button>
</Toolbar>
</AppBar>
<Container html="ExtReact App Template" fullscreen>
<Grid title="Users" store={this.store}>
<Column text="Name" dataIndex="name"/>
<Column text="Email" dataIndex="email"/>
</Grid>
</Container>
</ExtReact>
)
}
}