react-native组件写法

组件基本写法

默认情况下

  1. 组件的 flexDirection 为 列( flexDirection : 'column').
  2. view的默认宽度为100%

组件的默认值

<pre>
<code>
div, span {
box-sizing: border-box;
position: relative;

display: flex;
flex-direction: column;
align-items: stretch;
flex-shrink: 0;

border: 0 solid black;
margin: 0;
padding: 0;
}
</code>
</pre>

参考fb css layout
https://github.com/facebook/css-layout

搜索框

<p>

Paste_Image.png

代码部分

https://gist.github.com/sherlock221/7035e34cd37ee643bb04


简单的listview

使用简单datasource数据填充方式
https://gist.github.com/sherlock221/7f55e35ed536f51dc7ce


下拉刷新的listview

Paste_Image.png

代码：

https://gist.github.com/sherlock221/d0a22cd34964c958a5a6

最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容

  • awesome-android
    afinalAfinal是一个android的ioc，orm框架 https://github.com/yangf...
    passiontim阅读 15,492评论 2赞 45
  • 穿越
    第一章 穿越唐朝 夏雨晨和叶倩倩在咖啡厅里，倩倩抿了一小口咖啡，对雨晨说：“雨晨，今天约我出来有什么...
    e2a67615719a阅读 287评论 0赞 0
  • 商城模块链接
    转载链接，若有侵权，自会马上删除，不胜感激！电商技术解密http://www.jianshu.com/c/dac4...
    alialiali阅读 353评论 0赞 0
  • 你无法改变现状，是因为你还不够努力
    有句话说的好，“努力的最大意义，是让自己随时有能力跳出自己厌恶的圈子。”这是至理名言！ 如果我说我工作的不开心也不...
    一只不想被槌的Young阅读 837评论 0赞 0
  • 文化名人的原配夫人
    文化名人的原配夫人 文 | 丁茉莉 民国时期，由父母包办的婚姻很多，从而导致不少的...
    丁茉莉阅读 1,066评论 0赞 0