Simple React Snippets插件

Simple React Snippets

react 快速生成代码块插件

输入imrc生成如下代码:

import React, { Component } from 'react';

输入cc生成如下代码:

class Test extends Component {
  state = {  }
  render() { 
    return ( <div></div> );
  }
}
export default Test;

输入impt生成如下代码:

import PropTypes from 'prop-types';

输入ccc生成如下代码:

class  extends Component {
  constructor(props) {
    super(props);
    this.state = {  }
  }
  render() { 
    return (  );
  }
}
 
export default ;

输入sfc生成如下代码:

const  = () => {
  return (  );
}
 
export default ;

输入cdm生成如下代码:

componentDidMount() {
  
}

输入cwm生成如下代码:

//WARNING! To be deprecated in React v17. Use componentDidMount instead.
componentWillMount() {
  
}

输入cwrp生成如下代码:

//WARNING! To be deprecated in React v17. Use new lifecycle static getDerivedStateFromProps instead.
componentWillReceiveProps(nextProps) {
  
}

输入gds生成如下代码:

static getDerivedStateFromProps(nextProps, prevState) {
  
}

输入scu生成如下代码:

shouldComponentUpdate(nextProps, nextState) {
  
}

输入cwu生成如下代码:

//WARNING! To be deprecated in React v17. Use componentDidUpdate instead.
componentWillUpdate(nextProps, nextState) {
  
}

输入cdu生成如下代码:

componentDidUpdate(prevProps, prevState) {
  
}

输入cdc生成如下代码:

componentDidCatch(error, info) {
  
}

输入gsbu生成如下代码:

getSnapshotBeforeUpdate(prevProps, prevState) {}

输入ss生成如下代码:

this.setState({ :  });

输入ssf生成如下代码:

this.setState(prevState => {
  return { : prevState. };
});

输入ren生成如下代码:

render() {
  return (
     
  );
}

输入rprop生成如下代码:

class  extends Component {
  state = { :  }
  render() { 
    return this.props.render({
      : this.state.
    });
  }
}
export default ;

输入hoc生成如下代码:

function () {
  return class extends Component {
    constructor(props) {
      super(props);
    }
 
    render() {
      return < {...this.props} />
    }
  }
}