/
githubmirror
/
wp-calypso
Обзор
Документация
Войти
/
githubmirror
/
wp-calypso
Код
Задачи
Вики
Пакеты
0
Релизы
0
Аналитика
Безопасность
trunk
client/components/drop-zone/docs/example.jsx
62 строки
1 KB
Marko Andrijasevic
React: add new JSX transform (#56451)
29 сен 2021, 13:49
Не верифицирован
29 сен 2021, 13:49
f2e6f88
Код
Авторство
О чём код?
import { Card } from '@automattic/components'; import { localize } from 'i18n-calypso'; import { PureComponent } from 'react'; import DropZone from 'calypso/components/drop-zone'; const DropZoneExample = localize( class extends PureComponent { state = {}; onFilesDrop = ( files ) => { this.setState( { lastDroppedFiles: files, } ); }; renderContainerContent = () => { const style = { lineHeight: '100px', textAlign: 'center', }; let fileNames; if ( this.state.lastDroppedFiles ) { fileNames = this.state.lastDroppedFiles .map( function ( file ) { return file.name; } ) .join( ', ' ); } return ( <Card style={ style }> { fileNames ? this.props.translate( 'You dropped: %s', { args: fileNames } ) : this.props.translate( 'This is a droppable area' ) } </Card> ); }; renderContainer = () => { const style = { position: 'relative', height: '150px', }; return ( <div style={ style }> { this.renderContainerContent() } <DropZone onFilesDrop={ this.onFilesDrop } /> </div> ); }; render() { return this.renderContainer(); } } ); DropZoneExample.displayName = 'DropZone'; export default DropZoneExample;