JSXからすばやく行くステートレスコンポーネントをJSXに返すIntelliJのステートフルコンポーネントに反応する

Question

ステートレスコンポーネントからステートフルコンポーネントにすばやく移行したい場合がありますが、IntelliJでこれを行う方法があればプラグインを作成せずに）。

const Stateless = ({ propsDestructuring }) => { 
    console.log('Some logic'); 

    return (
    <div>Some JSX</div> 
); 
}; 

へ：

class Stateful extends Component { 
    render() { 
    const { 
     propsDestructuring 
    } = this.props; 

    console.log('Some logic'); 

    return (
     <div>Some JSX</div> 
    ); 
    } 
} 

代わりにも有用であろう明示的な戻りに "矢印ボディスタイル" から行く

、例えば例えば

は、から行きます

const Stateless = ({ propsDestructuring }) => (
    <div>Some JSX</div> 
); 

から行く：彼らは既存のコードを変異させることができないとして、このシナリオでは動作しないでしょうライブテンプレートを使用

const Stateless = ({ propsDestructuring }) => { 
    return (
    <div>Some JSX</div> 
); 
}; 

、唯一の新しい挿入します。助言がありますか？

Answer 1

あなたはから行くことができます：ここにテキストカーソルを置くことによって

const Stateless = ({ propsDestructuring }) => { 
    return (
    <div>Some JSX</div> 
); 
}; 

：に

const Stateless = ({ propsDestructuring }) => (
    <div>Some JSX</div> 
); 

const Stateless = ({ propsDestructuring }) => (
-----------------------------------------^----- 

と以下のポップアップを取得するために、Alt-Enterキーを押します：

Enterキーをもう一度押して、最上部の結果を選択すると、中括弧で矢印機能に変換されます。クラスへの変換機能に関して

、限り私は承知しているとしてそれをする方法はありませんが、あなたは常に検索を使って試してみて、変換するのに置き換えることができます：

const (.*) = \(.*\) => \{ 

へ：

class $1 extends React.Component { 

これをマクロに記録すると、その操作が少し速くなるはずです。