Bài 2 : Phần mềm lập trình ReactJS -VS Code Reactjs snippets - Lập trình website thật dễ

Bài 2 : Phần mềm lập trình ReactJS -VS Code Reactjs snippets

Ở đây mình dùng phần mềm Visual Studio + extension react để code nhanh hơn https://github.com/xabikos/vscode-react

Cách dùng
create react component

create react stateless component

Snippets

Danh sách snippets

TriggerContent
rcc→class component skeleton
rccp→class component skeleton with prop types after the class
rcjc→class component skeleton without import and default export lines
rcfc→class component skeleton that contains all the lifecycle methods
rsc→stateless component skeleton
rscp→stateless component with prop types skeleton
rpt→empty propTypes declaration
con→class default constructor with props
conc→class default constructor with props and context
est→empty state object
cwm→componentWillMount method
cdm→componentDidMount method
cwr→componentWillReceiveProps method
scu→shouldComponentUpdate method
cwup→componentWillUpdate method
cdup→componentDidUpdate method
cwun→componentWillUnmount method
ren→render method
sst→this.setState with object as parameter
ssf→this.setState with function as parameter
props→this.props
state→this.state
bnd→binds the this of method inside the constructor

The following table lists all the snippets that can be used for prop types. Every snippet regarding prop types begins with ptso it’s easy to group it all together and explore all the available options. On top of that each prop type snippets has one equivalent when we need to declare that this property is also required. For example pta creates the PropTypes.array andptar creates the PropTypes.array.isRequired

TriggerContent
pta→PropTypes.array,
ptar→PropTypes.array.isRequired,
ptb→PropTypes.bool,
ptbr→PropTypes.bool.isRequired,
ptf→PropTypes.func,
ptfr→PropTypes.func.isRequired,
ptn→PropTypes.number,
ptnr→PropTypes.number.isRequired,
pto→PropTypes.object.,
ptor→PropTypes.object.isRequired,
pts→PropTypes.string,
ptsr→PropTypes.string.isRequired,
ptnd→PropTypes.node,
ptndr→PropTypes.node.isRequired,
ptel→PropTypes.element,
ptelr→PropTypes.element.isRequired,
pti→PropTypes.instanceOf(ClassName),
ptir→PropTypes.instanceOf(ClassName).isRequired,
pte→PropTypes.oneOf(['News', 'Photos']),
pter→PropTypes.oneOf(['News', 'Photos']).isRequired,
ptet→PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
ptetr→PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
ptao→PropTypes.arrayOf(PropTypes.number),
ptaor→PropTypes.arrayOf(PropTypes.number).isRequired,
ptoo→PropTypes.objectOf(PropTypes.number),
ptoor→PropTypes.objectOf(PropTypes.number).isRequired,
ptsh→PropTypes.shape({color: PropTypes.string, fontSize: PropTypes.number}),
ptshr→PropTypes.shape({color: PropTypes.string, fontSize: PropTypes.number}).isRequired,
Bài 2 : Phần mềm lập trình ReactJS -VS Code Reactjs snippets
5 (100%) 3 votes
Hai thẻ thay đổi nội dung bên dưới.
Tôi hoạt động trong lĩnh vực CNTT, bao gồm Web Design, Web Development , Mobile Development (Hybird apps & Android apps) . Cùng chia sẻ kiến thức lập trình là niềm vui của tôi . Nhận xây dựng website cho khách hàng Việt Nam và quốc tế . Vui lòng liên hệ 01632 434 165 để nhận tư vấn .Trân trọng !

Ý kiến của bạn

Hỗ trợ trực tuyến