Vscode içinde code snippet çalıştırmak için kuracağımız eklenti adı React Native Snippet, kendi sayfasından inceleyebilirsiniz:
React Native Snippet kurmak ekranına, VsCode arayüzünde istersek Ctrl+Shift+X kısayolu ile ya da sol menüde bulunan Extensions button yardımıyla ulaşabiliriz. Gelen arama çubuğuna "React Native Snippet" yazarak install ile kullanmaya başlayabiliriz.
Eklentiyi kullanmak Örneğin rnc gibi bir komut yazdıktan sonra Ctrl+Space tuşuna basarak hazır kodlarımızı ekrana kısa yoldan getiriyoruz.
| Prefix | Method |
|---|---|
| imr→ | import React from 'react'; |
| imrc→ | import React, { Component } from 'react'; |
| imrcp→ | import React, { Component } from 'react' & import PropTypes from 'prop-types'; |
| imrpc→ | import React, { PureComponent } from 'react'; |
| imrpcp→ | import React, { PureComponent } from 'react' & import PropTypes from 'prop-types'; |
| redux→ | import { connect } from 'react-redux'; |
| rconst→ | constructor(props) with this.state |
| rconc→ | constructor(props, context) with this.state |
| est→ | this.state = { }; |
| cwm→ | componentWillMount = () => { }; |
| cdm→ | componentDidMount = () => { }; |
| cwr→ | componentWillReceiveProps = (nextProps) => { }; |
| scu→ | shouldComponentUpdate = (nextProps, nextState) => { }; |
| cwup→ | componentWillUpdate = (nextProps, nextState) => { }; |
| cdup→ | componentDidUpdate = (prevProps, prevState) => { }; |
| cwun→ | componentWillUnmount = () => { }; |
| ren→ | render() { return( ) }; |
| sst→ | this.setState({ }) |
| ssf→ | this.setState((state, props) => return { }) |
| props→ | this.props.propName |
| state→ | this.state.stateName |
