0

React と Material-UI は初めてで、現在のダイアログを印刷したいと考えています。

問題は、ブラウザでも実行しないと、プライティング用にダイアログを最大化する (フルスクリーンに設定する) 方法が見つからないことです。したがって、基本的には、ブラウザに小さなダイアログが必要であり、ダイアログには最大サイズが必要です。

TSX での私の基本的なコードは次のとおりです。

import React, { Component} from 'react';
import { Button, Dialog } from '@material/core';

export default class MUITester extends Component {

 render(){
   return (
      <Dialog fullScreen={false}>
        <div>
          <Button onClick={() => window.print()}>
            PRINT            
          </Button>
         </div>
       </Dialog> 
     );
   }

対応する css ファイル:

@media print {
   .print {
       fullScreen=true;
       color: blue;
    }  
}

cssで解決できますか？または、React/Material-UI を使用する必要がありますか?

4

4 に答える 4

0

ダイアログの幅は次のように設定できます。

<Dialog  fullWidth={true} maxWidth='md'>
    <div>
      <Button onClick={() => window.print()}>
        PRINT            
      </Button>
     </div>
    </Dialog>

ドキュメントに記載されているように

于 2020-01-28T09:02:31.860 に答える