新しいウィンドウにコンポーネントを表示する方法


  1. Reactアプリケーション内で新しいウィンドウを開くためのボタンを作成します。例えば、以下のようなコードを使用できます:
import React from 'react';
const Component = () => {
  const openNewWindow = () => {
    window.open('https://example.com', '_blank');
  };
  return (
    <div>
      <button onClick={openNewWindow}>新しいウィンドウを開く</button>
    </div>
  );
};
export default Component;
  1. 上記の例では、window.open()メソッドを使用して新しいウィンドウを開いています。第1引数には新しいウィンドウで表示するURLを指定し、第2引数には'_blank'を指定して新しいウィンドウで開くようにします。

  2. コンポーネント内のボタンをクリックすると、新しいウィンドウが開き、指定したURLが表示されます。

このようにして、Reactを使用して新しいウィンドウにコンポーネントを表示することができます。この方法を使用すると、ユーザーがボタンをクリックすると新しいウィンドウが開き、別のコンポーネントやウェブページを表示できます。