One: Shortcut keys
1. Make it self-updating----shift+cmd+z Select Hot Update
2.cmd+r---re-refresh
3
Two: Common norms:
1. The file is also a component so naming rules and component names should be the same-----use the first uppercase camel-like nextpage
Three: Tips:
1. Causes the ListView to appear in the ScrollBar workaround setting for the ListView
automaticallyAdjustContentInsets={false}
2.img Usage Tips
1: network resources
source={{uri:‘http://xxxxx/png‘}} />
2. Local Resources
source={require(‘image!lealogo‘)} />
3. Background image backgroundimage (be sure to set the following properties)
source={require(‘image!lealogo‘)} style={{backgroundColor:‘transparent‘}}>
4. Full Screen background <full screen> (first set the package flex:1, then the picture is also set flex:1 all scaling)
var testcmp = React.createclass ({render:function() {Return (<View Style={Styles.imagecontainer}> <Image Style={Styles.image} Source={{URI:‘http//Lorempixel.com/200/400/Sports/5/! [Enter Image description here ] [2] '}}/> </View>}} ) var styles = Stylesheet.create ({imagecontainer: {flex:1, Alignitems: ' Stretch '}, Image: {flex:1}});
Flex layouts
- View default width is 100%
- Flex analog column horizontally centered with Alignitems, vertically centered with justifycontent in the opposite direction of row
- Flex-based enables existing grid system requirements, and grids can be nested without bugs
Absolute positioning and relative positioning
Unlike the standard CSS, the element parent container does not have to set position: ' Absolute|relative '. The default is offset relative to the parent container.
http://www.jianshu.com/p/26dffb845046 See for yourself ...
Shortcut keys and common specifications for react native