在我的父组件里有一段跳转代码 ~~~ const MyApp = StackNavigator({ dynamicStack: { screen: TabScreen, navigationOptions: ({navigation}) => ({ headerStyle:styles.headerBar, headerTintColor:'#fff', headerRight:(<HeadScreen></HeadScreen>), }), }, dynamicDetail: { path: 'dynamic/:id/:aid', screen: DynamicDetailScreen, }, }); ~~~ 在dynamicDetail中的path里可以传入2个参数,id与aid ~~~ renderItem={({item}) => ( <TouchableOpacity onPress={() => this.props.navigation.navigate('dynamicDetail',{id:item.id,aid:item.aid})}> <View style={styles.item}> <View style={{flex:1}}> <Text style={styles.name}>{item.title}</Text> <Text style={styles.text}>{item.intro}</Text> <Text style={styles.time}>{item.time}</Text> </View> </View> </TouchableOpacity> )} ~~~ 在这个里面我将从服务器里获取的2个参数值传进去。 ~~~ constructor(props) { super(props); this.state = { title: '', time: '', content: '', count:0 }; const url = apiUrl+"/getArticleInfo.php?id="+this.props.navigation.state.params.id+'&aid='+this.props.navigation.state.params.aid; fetch(url).then(res => { return res.json(); }).then(res => { this.setState({ title: res.title, time: res.time, content: res.content, count:res.count }); }).catch(err => { }); }; ~~~ 在子组件里可以通过` this.props.navigation.state.params.id` 获取参数。 完整代码 **代码中的请求地址你可能用不了** 请求服务器参考数据 http://192.168.1.3/app/getArticle.php ~~~ [{ "id": "1349951", "title": "昆明的雨阅读答案", "aid": "1631382", "intro": "19.答案:①所画的是昆明雨季特有的现象与产物,突出昆明多雨的特点:②为下文做铺垫,引出下文对“昆明的雨”的描述,③吸引读者,引起读者的阅读兴趣。(答任两点即得全分) 20.(1)答案:运用人物的外貌、语言描写(细节描写)。(1分)用卖花女孩的娇美情态衬托出昆明雨季的柔美,抒发作者对昆明的怀念、喜爱之情。 (1分)(2)答案: “爬”“遮”等动词,把木香拟人化,(1分)生动形象地表现出木香的", "time": "2017-11-06 22:14:43" }, { "id": "1349950", "title": "雨阅读答案周晓枫", "aid": "1631381", "intro": "23.答案:雨的外形与丰富的内含 春雨的背景 雨的想象与赞美 评分:答对得3分。意思对即可。 24.答案:运用了烘托的手法,以大地上的伤痕累累、荒凉破败烘托雨给世界带来的生机活力,隐含着对雨的赞美之情。 评分:答对手法得2分,答对作用得2分。共4分。意思对即可。 25.答案:以石块的坚硬无情与来自高空的“雨”进行对比,彰显雨的温柔仁爱的特点,从而突出文章主旨。 评分:答对得4分。意", "time": "2017-11-06 22:13:25" }, { "id": "1349949", "title": "时间煮雨语录", "aid": "1631380", "intro": "牵手倾心,离别倾泪;一生的等待给了谁,一世的孤独为了谁。 朦胧恍惚中,哪一声呢喃是你给的风花雪月,哪一缕清香是你种的千年思念。 剪不断烟雨萦绕离愁,看不见身影缥缈,诉不尽苦思痴念,等也心痛,念也心乱。 流连错落的思念,穿过千年的等待,穿过无边的寂寞,轮回的路口谁在等待,是柔情似水,倾城容颜的你吗? 几世轮回,几世佛前虔诚,谁的呼唤在轮回的路上回荡千百年?千年等待,千年孤独;几番绕指柔,", "time": "2017-11-06 22:12:48" }, { "id": "1349948", "title": "夜深了窗外下着雨的语录", "aid": "1631379", "intro": "夏天,雨点哗啦啦。天上的雨点像筛豆子似的往下直掉,打碎了如镜的湖面,吓跑了原本想跳上水面看看雨景的小鱼儿。 像雾似的雨,像雨似的雾,丝丝缕缕缠绵不断。 你听!雨掉在屋面上“嘀塔嘀嗒”,就像奏着打击乐。雨下到水塘里“丁丁丁”地唱起来,水面上还溅起一朵朵小水花,又似水花姑娘在轻盈地舞蹈…… 一会儿,粗大的雨点儿落下来了,打在玻璃窗上叭叭直响。雨越下越大。我透过玻璃窗向外望去,天地间像挂着无比", "time": "2017-11-06 22:10:19" }, { "id": "1349947", "title": "中考满分作文雨", "aid": "1631378", "intro": "第一篇 不停地下,水不断往上涨,潮漫湿了我枯干的心灵…… 淅沥淅沥的声音在耳边萦绕,来到窗边,用温热的手指划去窗上的雾气,看见了窗子外无数晶莹的雨滴组成的无边的雨帘。从盘古开天地,雨就降临到了这个世界。雨,不正是李煜“剪不断理还乱”的思绪吗?雨,陪李白酒入豪肠将七分酿成月光,三分啸成剑气,绣口一吐出半个唐朝;雨,拌骆宾王“楼观沧海日,门对浙江潮。”雨,随李清照拌舟湖畔“惊起一滩鸥鹭”。雨,", "time": "2017-11-06 22:08:51" }, { "id": "1349946", "title": "写雨的作文400字", "aid": "1631377", "intro": "第一篇 早晨,我还在床上伸懒腰,从窗外模模糊糊地传来“淅淅沥沥”的声音。我想一定是下雨了。 果然,窗外飘着缕缕轻柔的雨丝,像牛毛,像花针,细雨如丝,纵横交错成“薄纱”。雨点飘到屋顶上、树上、地上,洗清了长年累月的灰尘,也洗清了郁积在我心中的烦恼。一颗颗珍珠般的雨点在花瓣上滚动,好像是雨姑娘送给他们的首饰。雨点“噼噼啪啪”打在窗户上,像是给窗户点缀着晶莹的“珍珠”。马路上,人们打着五颜六色的", "time": "2017-11-06 22:07:34" }, { "id": "1349945", "title": "桂花雨阅读答案", "aid": "1631376", "intro": "16.点题。通过桂花的香味引起思乡之情,并为全文怀乡定下感情基调。(一点1分,答全4分) 17.突出了出桂花的朴实的品格,是作者最欣赏(喜爱)的,突出了作者对故乡的深情。(一点1分,答全4分) 18.摇桂花的过程富于童趣,烘托出故乡“人和年丰”的生活,写其父母表现了母亲温柔宽厚的心胸和父亲儒雅、和乐的性格,这都是家乡留给作者的美好回忆。(每点1分,最后一点2分,共6分) 19.桂花,真叫", "time": "2017-11-06 17:46:40" }, { "id": "1349944", "title": "鸟类的语言阅读答案", "aid": "1631375", "intro": "1.答案要点:①录取大自然的鸟巢中鸟的叫声;②观察巢中鸟的一举一动,把叫声和活动对照起来研究;③用电子计算机处理所获得的大量数据. 2.答案:鸟类“语言”中也有“方言”、“土语”. 3.答案:人类掌握了鸟语的秘密后,就有可能有目的地利用鸟语,定向地管理鸟类,使之为人类服务. 4.答案:“极为”这个词语,①准确地②说明了鸟语含义丰富的程度.", "time": "2017-11-06 17:45:45" }, { "id": "1349943", "title": "梅子黄时雨经典语录", "aid": "1631374", "intro": "1. 她不可能打入这个圈子,也从未想过要打入这个圈子。 2. 记忆中的东西总是最美的,因为那流水年华,也只因是已经过去了的。 3. 她虽然年轻,但终究是明白的,什么事情总讲究门当户对。那是老祖宗积淀了几千年传下来的,若不是真理,早给大浪淘沙掉了。她与他们总归不是同路人。 4. 她和他一向没有什么话,他不说,她也不知道说什么。若是他说了,她也应几句,绝不主动攀谈。 5. 人都是这个样子的", "time": "2017-11-06 17:44:34" }, { "id": "1349942", "title": "情深深雨蒙蒙语录", "aid": "1631373", "intro": "·尔豪第一次在大上海看到依萍。在书桓家。 书桓:哎!原来你姓陆啊!我总算知道了!(望著依萍,开心得不得了,我想这个时候,房间裏最快乐的人莫过於书桓了!) ·书桓骑自行车送依萍回家,依萍坐在前座。 书桓:陆依萍!哪一个依啊? 依萍:小鸟依人的依。书桓:是像现在这样吗? 依萍:兴奋?兴奋什麽? 书桓:因为我终於弄清楚你是尔豪的妹妹。。。所以说今天晚上我虽然说很震动,可是,也有一种如释重负的", "time": "2017-11-06 17:43:25" }] ~~~ http://192.168.1.3/app/getArticleInfo.php?id=1&aid=1 ~~~ { "title": "中学生的休养与择业", "time": "2015-12-13 15:45:51", "count": "349", "content": "<p>  &nbsp; &nbsp; &nbsp; 今天我应该讲些什么?事先曾请教吴县长,师范刘校长和同来的几位朋友,他们以今天到场的大多数是青年朋友们,也有青年朋友的父兄,因此要我讲讲中等教育的东西。同时,我到过的地方,许多朋友常常问我中学生应注重什么?中学毕业后,升学的应该怎样选科?到社会里去的应该怎样择业?我是不懂教育的,不过年纪大些,并且自己也是经过中学大学过来的,同时看到朋友们与我们自己的子弟经过中学,得到一点认识,愿意将自己的认识提出来供大家的参考,今天讲的题目,就是:&ldquo;中学生的修养与中学生的择业。&rdquo;<br \/>\r\n&nbsp;<br \/>\r\n&nbsp;&nbsp;&nbsp;&nbsp;中学生的修养应注意两点:<br \/>\r\n&nbsp;<br \/>\r\n&nbsp;&nbsp;&nbsp;<strong>&nbsp;一、工具的求得<\/strong>&nbsp;&nbsp;中学生大概是从十二岁的幼年到十八岁的青年,这个时期是决定他将来最重要的一个时期。求知识与做人、做事的工具,要在这个时期求得。古人说:&ldquo;工欲善其事,必先利其器&rdquo;,中学生要将来有成就,便应该注意到&ldquo;求工具www.haowen100.com学业上,事业上,求知识上所需要的工具。求工具的目标有二:一是中学毕业后无力升学要到社会里去就业;一是继续升学。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 第一种工具是语言文字。不论就业或升学,以我个人的经验和观察所得,语言文字是最需要的工具。在中学里不仅应该学好本国的语言文字,最好能多学一二种外国的语言文字。它是就业升学的钥匙,能为我们打开知识的门。多学得一种语言,等于辟开一个新的花园、新的世界。语言文字,可以说是中学时期应该求得的工具当中非常重要的了。在中学时期如果没有打好语言文字的基础,以后作学问非常的困难。而且过了这个时期,很少能够把语言文字弄好的。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 第二种工具是科学的基本知识。许多人都说学了数学,将来没有什么用处,这是错误的。数学是自然科学重要的钥匙,如果不能把这个重要的钥匙www.haowen100.com数学,与物理学、化学、生物学、矿物学、植物学等,在中学时期学好,则不能求得新的知识。所以中学时期最重要的,是把这些基本知识弄好。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 青年们在学校里对于各种基本科学,不能当它是功课,是学校课程里面需要的功课,应该把它当成求知识、做学问、做人的工具,必不可少的工具。拿工具这个观念来看课程,课程便活了。拿工具这个观念来批评课程,可以得到一个标准。首先看看哪些功课够得上作工具,并分出哪些功课是求知识做学问的工具,哪些功课是做人的工具。哪些功课是重要,哪些功课是次要。同时拿工具这个观念来衡量,哪种教法是死的笨的,请先生改良,哪些应该特别注重,请先生注意。我这个话,不是叫学生对先生造反,而是请先生以工具来教,不要死板的照课本讲,这样推动先生,可以使得先生从没有精神提起精神,不是造反而是教学相长,不把功课当作功课看,把它当作必须的工具看。拿工具的观念看功课,功课便是活的,这一点也可以说是中学生治学的方法。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp;&nbsp;&nbsp;<strong>&nbsp;二、要养成良好的习惯<\/strong>&nbsp;&nbsp;良好习惯的养成,即普通所谓的人品教育,品性人格的陶冶。教育学家心理学家都告诉我们说:人品性格是习惯的养成,好的品格是好的习惯养成。中学生是定型的阶段,中学生时期与其注重治学的方法,毋宁提倡良好的习惯的养成。一个人的坏习惯在中学还可纠正,假使在中学里不能养成良好的习惯,这个人的前途便算完了,在大学里不会是个好学生,在社会里不会是个有用的人才。我原在这里提醒青年学生们的注意,也请学生的父兄教师们注意。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 我们的国家以前专注重文字教育,读书人的指甲蓄得很长,手脸都是白白的,行动是文绉绉的,读书可以从&ldquo;学而时习之&rdquo;背诵起,写文章摇摇摆摆地会写出许多好听的词句来,可是他们是无用的,不能动手,也不能动脚,连桌凳有一点坏了,也不能拿起斧头钉子来修理。这种只能背书写文章的读书人就是没有养成良好的习惯www.haowen100.com动手动脚的习惯。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 我在台湾大学讲《治学方法》时,讲到一个故事:宋时有一新进士请教老前辈做官的秘诀,老前辈告诉他四个字:勤谨和缓。这四个字大家称为做官的秘诀,我把它看作做人、做事、做学问的秘诀。简单的分别说:<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 勤,就是不偷懒,不走捷径,要切切实实,辛辛苦苦的去做。要用眼睛的用眼睛,用手的用手,用脚的用脚,先生叫你找材料,你就到应该到的地方去找。叫你找标本,你就到田野,到树林里去找,无论在实验室里,在自然界里,都不要偷懒,一点一滴的去做。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 谨,就是谨慎,不粗心,不苟且,以江浙的俗话来说,不拆烂污。写汉字,一点、一横也不放过;写外国字,&ldquo;i&rdquo;的点、&ldquo;t&rdquo;的横,也一样不放过;做数学,一个圈、一个小数点都不苟且。不要以为这是小事情,做小事关系天下的大事,做学问关系成败,所以细心谨慎,是必须养成的习惯。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 和,就是不要发脾气,不要武断,要虚心,要和和平平。什么叫做虚心?脑筋不存成见,不以成见来观察事实,不以成见来对待人。就做学问来说,要以心平气和的态度来做化学、数学、历史、地理,并以心平气和的态度来学语文。无论对事,对人,对物,对问题,对真理,完全是虚心的,这叫做和。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 缓,这个字很重要,&ldquo;缓&rdquo;的意思是不要忙,不轻易下结论。如果没有缓的习惯,前面三个字就不容易做到。譬如找证据,这是很难的工作,如果限定几点钟交卷,就不能做到&ldquo;勤&rdquo;的工夫;忙于完成,证据不够,不管它了,这样就不能做到&ldquo;谨&rdquo;的工夫;匆匆忙忙地去做,当然不能做到&ldquo;和&rdquo;的工夫。所以证据不够,应当悬而不断,就是姑且先挂在那里,悬而不断,并不是叫你搁下就不管,是要你勤,要你谨,要你和。缓,就是南方人说的&ldquo;凉凉去吧&rdquo;,缓的意思,是要等着找到了充分的证据,然后根据事实来下判断。无论作学问、作事、作官、作议员,都是一样的。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 大家知道治花柳病的名药&ldquo;六零六&rdquo;吧?什么叫&ldquo;六零六&rdquo;呢?经过六百零六次的试验才成功的。&ldquo;九一四&rdquo;则试验了九百一十四次。达尔文的生物进化论,认为动植物的生存进化与环境有绝大的关系,也费了三十年的工夫,到四海去搜集标本和研究,并与朋友们往复讨论。朋友们都劝他发表,他仍然不肯。后来英国皇家学会收到另一位科学家华莱士的论文,其结论与达尔文的一样,朋友们才逼着达尔文把研究的结论公布,并提出与朋友们讨论的信件,来证明他早已获得结论,于是皇家学会才决定同华莱士的论文同时发表,达尔文这种持重的态度,不是缺点,是美德,这也是科学史上勤谨和缓的实例。值得我们去想想,作为榜样,尤其青年学生们要在中学里便养成这种习惯。有了这种好习惯,无论是做人做事做学问,将来不怕没有成就。&nbsp;<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 中学生高中毕业后,面临的问题是继续升学或到社会支找职业。升学应如何选科?到社会去如何择业?简单的说,有两个标准:<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; <strong>&nbsp; 一、社会的标准<\/strong>&nbsp;&nbsp;社会上所需要的,最易发财的,最时髦的是什么?这便是社会的标准。台湾大学钱校长告诉我说,今年台大招生,投考学生中外文成绩好的都投考工学院,尤其是考电机工程、机械工程和特多,考文史的则很少,因为目前社会需要工程师,学成后容易得到职业而且待遇好。这种情形,在外国也是一样的,外国最吃香和学科是原子能、物理学和航空工程,干这一行的,最受欢迎,最受优待。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp;<strong> 二、个人的标准<\/strong>&nbsp;&nbsp;所谓个人的标准,就是个人的兴趣、性情、天才近哪门学科,适于哪一行业。简单的说,能干什么。社会上需要工程师,学工程的固不忧失业,但个人的性情志趣是否与工程相合?父母兄长爱人都希望你学工程,而你的性情志趣,甚至天才,却近于诗词,小说,戏剧,文学,你如迁就父母兄长爱人之所好而去学工程,结果工程界里多了一个饭桶,国家社会失去了一个第一流的诗人、小说家、文学家、戏剧学家,不是可惜了吗?所以个人的标准比社会的标准重要。因为社会标准所需要的太多,中国人常说社会职业有三百六十行,这是以前的说法,现在何止三百六十行,也许三千六百行,三万六千行都有,三千六百行,三万六千行,行行都需要。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 社会上需要建筑工程师,需要水利工程师,需要电力工程师,也需要大诗人、大美术家、大法学家、大政治家,同时也需要做新式马桶的工人。能做新式马桶的,照样可以发财。社会上三万六千行,既是行行都需要,一个人决不可能会做每行的事,顶多会二三行,普通都只能会一行的。在这种情形之下,试问是社会的标准重要?还是个人的标准重要?当然是个人的重要!因此选科择业不要太注重社会上的需要,更不要迁就父母兄长爱人的所好。爸爸要你学赚钱的职业,妈妈要你学时髦的职业,爱人要你学社会上有地位的职业,你都不要管他,只问你自己和性情近乎什么?自己的天才力量能做什么?配作什么?要根据这些来决定。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 历史上在这一方面,有很好的例子,意大利的伽俐略是科学的老祖宗,是新的天文学家,新的物理学家的老祖宗。他的父亲是一个数学家,当时学数学的人很倒霉。在伽俐略进大学的时候(三百多年前),他父亲因不喜欢,所以要他学医,可是他读医科,毫无兴趣,朋友们以他的绘画还不坏,认为他有美术天才,劝他改学美术,他自己也颇以为然。有一天他偶然走过雷积教授替公爵府里面作事的人补习几何学的课室,便去偷听,竟大感兴趣,于是医学不学了,画也不学了改学他父亲不喜欢的数学。后来替全世界创立了新的天文学、新物理学,这两门学问都建筑于数学之上。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 最后说我个人到外国读书的经过,民国前二年,考取官费留美,家兄特从东三省赶到上海为我送行,以家道中落,要我学铁路工程,或矿冶工程,他认为学了这些回来,可以复兴家业,并替国家振兴实业。不要我学文学、哲学,也不要学做官的政治法律,说这是没有用的。当时我同许多人谈过这个问题。以路矿都不感兴趣,为免辜负兄长的期望,决定选读农科,想做科学的农业家,以农报国。同时美国大学农科,是不收费的,可以节省官费的一部分,寄回补助家用。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 进农学院以后第三个星期,接到实验系主任的通知,要我到该系报到实习。报到以后,他问我:&ldquo;你有什么农场经验?&rdquo;我说:&ldquo;我不是种田的。&rdquo;他又问我:&ldquo;你做什么呢?&rdquo;我说:&ldquo;我没有做什么,我要虚心来学,请先生教我。&rdquo;先生答应说:&ldquo;好。&rdquo;接着问我洗过马没有,要我洗马。我说:&ldquo;我们中国种田,是用牛不是用马。&rdquo;先生说:&ldquo;不行。&rdquo;于是学洗马,先生洗一半,我洗一半。随即学驾车,也是先生套一半,我套一半。作这些实习,还觉得有兴趣。下一个星期的实习,为包谷选种,一共有百多种,实习结果,两手起了泡,我仍能忍耐,继续下去,一个学期结束了,各种功课的成绩,都在八十五分以上。到了第二年,成绩仍旧维持到这个水准。依照学院的规定,各科成绩在八十五分以上的,可以多选两个学分的课程,于是增选了种果学。起初是剪树、接种、浇水、捉虫,这些工作,也还觉得有兴趣。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 在上种果学的第二学期,有两小时的实习苹果分类,一张长桌,每个位子分置了四十个不同种类和苹果,一把小刀,一本苹果分类册,学生们须根据每个苹果的长短,开花孔的深浅、颜色、形状、果味和脆软等标准,查对苹果分类册,分别其类别(那时美国苹果有四百多类,现恐有六百多类了),普通名称和学名。美国同学都是农家子弟,对于苹果的普通名称一看便知,只需在苹果分类册里查对学名,便可填表缴卷,费时甚短。我和一位郭姓同学则需一个一个的经过所有检别的手续,花了两小时半,只分类了二十个苹果,而且大部分是错的。晚上我对这种实习起了一种念头:我花了两小时半的时间,究竟是在干什么?中国连苹果种子都没有,我学它什么用处?自己的性情不相近,干吗学这个?<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 这两个半钟头的苹果实习使我改行,于是,决定离开农科。放弃一年半的时间(这时我已上了一年半的课)牺牲了两年的学费,不但节省官费补助家用已不可能,维持学业很困难,以后我改学文科、学哲学、政治、经济、文学,在没有回国时,以前与朋友们讨论文学问题,引起了中国的文学革命运动,提倡白话,拿白话作文,作教育工具,这与农场经验没有关系,苹果学没有关系,是我那时的兴趣所在。我的玩意儿对国家贡献最大的便是文学的&ldquo;玩意儿&rdquo;,我所没有学过的东西。最近研究《水经注》(地理学的东西)。<br \/>\r\n&nbsp;<br \/>\r\n&nbsp; &nbsp; &nbsp; 我已经六十二岁了,还不知道我究竟学什么?都是东摸摸,西摸摸,也许我以后还要学学水利工程亦未可知,虽则我现在头发都白了,还是无所专长,一无所成。可是我一生很快乐,因为我没有依社会需要的标准去学时髦。我服从了自己的个性,根据个人的兴趣所在去做,到现在虽然一无所成,但是我生活的很快乐,希望青年朋友们,接受我经验得来的这个教训,不要问爸爸要你学什么,妈妈要你学什么,爱人要你学什么。要问自已性情所近,能力所能做的去学。这个标准很重要,社会需要的标准是次要的。<br \/><\/p>" } ~~~ 完整js代码 ~~~ import React from 'react'; import { ToastAndroid,FlatList, StyleSheet,View, Text,Button,Image,StatusBar,WebView,TouchableOpacity,Modal} from 'react-native'; import { TabNavigator,StackNavigator} from 'react-navigation'; const apiUrl = 'http://192.168.1.3/app'; //动态组件 class DynamicScreen extends React.Component { static navigationOptions = { title: '动态', tabBarIcon: ({ focused, tintColor }) => ( <Image source={require('./icon/ic_home_black_24dp.png')} style={{ width: 28, height: 28, tintColor: tintColor }} /> ), }; constructor(props) { super(props); this.state = { error: false, page: 1, refreshing: false, data: {}, totalPage:15 }; this.requestData(); }; handleRefresh = () => { this.setState({ page: 1, refreshing: true, data: [], }, () => { this.requestData(); }); } handleRefresh2 = () => { this.setState({ page: (this.state.page+1), refreshing: true }, () => { this.requestData(); }); } requestData = () => { if(this.state.page > this.state.totalPage){ ToastAndroid.show('没有数据啦 !', ToastAndroid.SHORT); this.setState({refreshing: false}); return false; } const url = apiUrl+"/getArticle.php?page="+this.state.page; fetch(url).then(res => { return res.json(); }).then(res => { this.setState({ data: [...this.state.data, ...res], error: res.error || null, refreshing: false }); }).catch(err => { this.setState({ error: err, refreshing: false}); }); } render() { return ( <View style={styles.container}> <FlatList keyExtractor={item => item.id} data={this.state.data} refreshing={this.state.refreshing} onRefresh={this.handleRefresh} onEndReached={this.handleRefresh2} onEndReachedThreshold={0.5} renderItem={({item}) => ( <TouchableOpacity onPress={() => this.props.navigation.navigate('dynamicDetail',{id:item.id,aid:item.aid})}> <View style={styles.item}> <View style={{flex:1}}> <Text style={styles.name}>{item.title}</Text> <Text style={styles.text}>{item.intro}</Text> <Text style={styles.time}>{item.time}</Text> </View> </View> </TouchableOpacity> )} ItemSeparatorComponent={ ()=>( <View style={{backgroundColor:'#EBEBEB',height:5}}> </View> ) } ListEmptyComponent={ ()=>( <View style={{height:50,flex:1,alignItems:'center',justifyContent:'center',backgroundColor:'#fff'}}> <Text style={{color:'#232323'}}>暂无数据</Text> </View> ) } ListFooterComponent={ ()=>( <View style={{height:40,justifyContent:'center',alignItems:'center'}}> <Text>我是有底线的</Text> </View> ) } ListHeaderComponent={ ()=>( <View style={{height:40,justifyContent:'center',alignItems:'center'}}> <Text>有新动态</Text> </View> ) } /> </View> ); } } //动态组件详情组件 class DynamicDetailScreen extends React.Component { constructor(props) { super(props); this.state = { title: '', time: '', content: '', count:0 }; const url = apiUrl+"/getArticleInfo.php?id="+this.props.navigation.state.params.id+'&aid='+this.props.navigation.state.params.aid; fetch(url).then(res => { return res.json(); }).then(res => { this.setState({ title: res.title, time: res.time, content: res.content, count:res.count }); }).catch(err => { }); }; static navigationOptions = ({ navigation }) => ({ title:'动态详情', headerStyle:styles.headerBar, headerTintColor:'#fff' }); render(){ return ( <View style={styles.container}> <View style={{alignItems:'center',justifyContent:'center',padding:10,backgroundColor:'#fff',borderBottomWidth:1,borderBottomColor:'#f5f5f5'}}> <Text style={{fontSize:20,color:'#232323'}}>{this.state.title}</Text> </View> <View style={{flexDirection:'row',alignItems:'center',justifyContent:'center',padding:10,backgroundColor:'#fff',borderBottomWidth:1,borderBottomColor:'#f5f5f5'}}> <Text>时间:{this.state.time}</Text> <Text style={{marginLeft:10}}>阅读:{this.state.count}</Text> </View> <WebView source={{html:this.state.content,baseUrl:''}} /> </View> ); } } //发现组件 class FindScreen extends React.Component { static navigationOptions = { title: '发现', tabBarIcon: ({ focused, tintColor }) => ( <Image source={require('./icon/ic_group_work_black_24dp.png')} style={{ width: 28, height: 28, tintColor: tintColor }} /> ), }; render() { return ( <View style={[styles.container,styles.findBody]}> <View style={styles.findView}> <Image source={require('./icon/ic_group_black_24dp.png')} style={styles.findViewIcon} /> <Text style={styles.findViewText}> 朋友圈 </Text> </View> <View style={styles.findView}> <Image source={require('./icon/ic_filter_center_focus_black_24dp.png')} style={styles.findViewIcon} /> <Text style={styles.findViewText}>扫一扫</Text> </View> <View style={styles.findView}> <Image source={require('./icon/ic_search_black_24dp.png')} style={styles.findViewIcon} /> <Text style={styles.findViewText}>搜一搜</Text> </View> <View style={styles.findView}> <Image source={require('./icon/ic_shopping_cart_black_24dp.png')} style={styles.findViewIcon} /> <Text style={styles.findViewText}>购物</Text> </View> <View style={[styles.findView,styles.findMT]}> <Image source={require('./icon/ic_games_black_24dp.png')} style={styles.findViewIcon} /> <Text style={styles.findViewText}>游戏</Text> </View> <View style={styles.findView}> <Image source={require('./icon/ic_code_black_24dp.png')} style={styles.findViewIcon} /> <Text style={styles.findViewText}>小程序</Text> </View> </View> ); } } //我的组件 class MyScreen extends React.Component { static navigationOptions = { title: '我的', tabBarIcon: ({ focused, tintColor }) => ( <Image source={require('./icon/ic_account_circle_black_24dp.png')} style={{ width: 28, height: 28, tintColor: tintColor }} /> ), }; render() { return ( <View style={[styles.container,styles.findBody]}> <View style={styles.findView}> <Image source={require('./icon/ic_person_outline_black_24dp.png')} style={styles.findViewIcon2} /> <View style={[styles.findViewText2,{flex:8,justifyContent:'center'}]}> <Text style={{color:'#232323',fontSize:18}}>全球变暖</Text> <Text style={{color:'gray',marginTop:8}}>微信号:weibo</Text> </View> </View> <View style={styles.findView}> <Image source={require('./icon/ic_monetization_on_black_24dp.png')} style={styles.findViewIcon} /> <Text style={styles.findViewText}>钱包</Text> </View> <View style={styles.findView}> <Image source={require('./icon/ic_chrome_reader_mode_black_24dp.png')} style={styles.findViewIcon} /> <Text style={styles.findViewText}>收藏</Text> </View> <View style={[styles.findView,styles.findMT]}> <Image source={require('./icon/ic_photo_library_black_24dp.png')} style={styles.findViewIcon} /> <Text style={styles.findViewText}>相册</Text> </View> <View style={[styles.findView,styles.findMT]}> <Image source={require('./icon/ic_card_giftcard_black_24dp.png')} style={styles.findViewIcon} /> <Text style={styles.findViewText}>卡包</Text> </View> <View style={[styles.findView,styles.findMT]}> <Image source={require('./icon/ic_tag_faces_black_24dp.png')} style={styles.findViewIcon} /> <Text style={styles.findViewText}>表情</Text> </View> <View style={styles.findView}> <Image source={require('./icon/ic_settings_black_24dp.png')} style={styles.findViewIcon} /> <Text style={styles.findViewText}>设置</Text> </View> </View> ); } } //定义tab组件 const TabScreen = TabNavigator({ dynamic: { screen: DynamicScreen }, find: { screen: FindScreen }, my:{ screen:MyScreen } },{ tabBarPosition: 'bottom',//选项卡位置 animationEnabled: true, tabBarOptions: { activeTintColor: '#02A8F3',//选中颜色 inactiveTintColor:'#757575',//未选中颜色 //设置选项卡的背景颜色 style: { backgroundColor: '#FCFCFC', borderTopWidth:1, borderTopColor:'#E8E8E8' }, //去掉安卓点击之后的小黄线 indicatorStyle: { height: 0 }, //是否显示icon图标 showIcon:true, //选项卡样式 tabStyle:{ height:50, paddingBottom:10 }, //icon样式 iconStyle:{ marginBottom:-8, marginTop:12 } } }); //组件样式 const styles = StyleSheet.create({ container: { flex: 1, backgroundColor:'#EBEBEB' }, item: { flex:1, flexDirection:'row', padding:15, backgroundColor:'#fff', }, name:{ color:'#007ACC', fontSize:18, marginBottom:10 }, text:{ color:'gray', fontSize:14, marginTop:2 }, time:{ color:'gray', fontSize:12, marginTop:8 }, //动态组件图片 userphoto:{ width:40, height:40, tintColor:'#9E9E9E' }, //头部组件+ headAdd:{ width: 24, height: 24, tintColor: '#fff', marginRight:20, }, //发现组件样式 findView:{ backgroundColor:'#fff', marginTop:15, padding:10, alignItems:'center', flexDirection:'row', }, findViewText2:{ flex:8, }, findViewIcon:{ width:24, height:24, marginRight:10 }, findViewIcon2:{ flex:2, width:46, height:46, }, findViewText:{ fontSize:18, color:'#232323', }, findBody:{ backgroundColor:'#EBEBEB' }, findMT:{ marginTop:0, borderTopWidth:1, borderTopColor:'#EBEBEB' }, //header样式 headerBar:{ backgroundColor:'#242529', } }); class HeadScreen extends React.Component{ constructor(props) { super(props); } render(){ return ( <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}> <TouchableOpacity onPress={() => { alert('55555555'); }}> <Image source={require('./icon/ic_add_black_24dp.png')} style={styles.headAdd} /> </TouchableOpacity> </View> ); } } // myapp路由 const MyApp = StackNavigator({ dynamicStack: { screen: TabScreen, navigationOptions: ({navigation}) => ({ headerStyle:styles.headerBar, headerTintColor:'#fff', headerRight:(<HeadScreen></HeadScreen>), }), }, dynamicDetail: { path: 'dynamic/:id/:aid', screen: DynamicDetailScreen, }, }); export default MyApp; ~~~