RCC + TABCreate a React component class using the ES6 module system
import React, {Component} from 'react';
class Test extends Component {
render() {
return (
<div>
</div>); }}export default Test;
Copy the code
RCCP + TABCreate a React component class with PropTypes and an ES6 module system
import React, {Component} from 'react';
import PropTypes from 'prop-types';
class Test extends Component {
render() {
return (
<div>
</div>
);
}
}
Test.propTypes = {};
export default Test;
Copy the code
RCFC + TABCreate a React component class with PropTypes and all lifecycle methods and the ES6 module system
import React, {Component} from 'react';
import PropTypes from 'prop-types';
class Test extends Component {
constructor(props) {
super(props);
}
componentWillMount(){}componentDidMount(){}componentWillReceiveProps(nextProps){}shouldComponentUpdate(nextProps, nextState){}componentWillUpdate(nextProps, nextState){}componentDidUpdate(prevProps, prevState){}componentWillUnmount(){}render() {
return (
<div>
</div>
);
}
}
Test.propTypes = {};
export default Test;
Copy the code
RCJC + TABCreate a React component class with the ES6 module system (no export)
class Test extends Component {
render() {
return (
<div>
</div>); }}Copy the code
RDP + TAB: Generates defaultProps quickly
.defaultProps = {
};
Copy the code
RPC + TABCreate a React pure component class with PropTypes and the ES6 Moudle system
import React, {PureComponent} from 'react';
import PropTypes from 'prop-types';
class Test extends PureComponent {
render() {
return (
<div>
</div>
);
}
}
Test.propTypes = {};
export default Test;
Copy the code
RRC + TABCreate a React component class connected to redux
import React, {Component} from 'react';
import {connect} from 'react-redux';
function mapStateToProps(state) {
return {};
}
class Test extends Component {
render() {
return (
<div>
</div>); }}export default connect(
mapStateToProps,
)(Test);
Copy the code
RRDC + TABCreate a React component class that connects to Redux via Dispatch
import React, {Component} from 'react';
import {connect} from 'react-redux';
function mapStateToProps(state) {
return {};
}
function mapDispatchToProps(dispatch) {
return {};
}
class Test extends Component {
render() {
return (
<div>
</div>); }}export default connect(
mapStateToProps,
)(Test);
Copy the code
RSC + TABCreate a stateless React component without a system of PropTypes and ES6 modules
import React from 'react';
const Test = () = > {
return (
<div>
</div>
);
};
export default Test;
Copy the code
RSCP + TABCreate a stateless React component with PropTypes and ES6 module system
import React from 'react';
import PropTypes from 'prop-types';
const Test = props= > {
return (
<div>
</div>
);
};
Test.propTypes = {
};
export default Test;
Copy the code
RSF + TAB: Creates a stateless React component as a named function, without PropTypes
import React from 'react';
function Test(props) {
return (
<div></div>
);
}
export default Test;
Copy the code
RSFP + TAB: Create stateless React components as named functions using PropTypes
import React from 'react';
import PropTypes from 'prop-types';
Test.propTypes = {
};
function Test(props) {
return (
<div></div>
);
}
export default Test;
Copy the code
Rsi + TABCreate a stateless React component that does not use PropTypes and the ES6 module system, but uses implicit returns and props
import React from 'react';
const Test = (props) = > (
);
export default Test;
Copy the code
RWWD + TAB: Create a React component class with constructors, null states, proptypes, and exports in the ES6 module system without an import. (Mainly for React, PropType is provided by a webpack plug-in)
class Test extends React.Component {
constructor(props) {
super(props);
this.state = {};
}
render() {
return (
<div>
</div>
);
}
}
Test.propTypes = {};
export default Test;
Copy the code