罗广聪 / ProtectGod

Go to a project
Toggle navigation Toggle navigation pinning
罗广聪
b7dd1cf7 1 parent 66293239

基础navigation,属性和跳转传值还没处理

Inline Side-by-side
Showing 12 changed files with 275 additions and 675 deletions
@@ -6,9 +6,22 @@ @@ -6,9 +6,22 @@
6 6
7 import React, { Component } from "react"; 7 import React, { Component } from "react";
8 import { AppRegistry, StyleSheet, Text, View } from "react-native"; 8 import { AppRegistry, StyleSheet, Text, View } from "react-native";
9 -import Main from "./src/pages/main"; 9 +import { StackNavigator, TabNavigator } from "react-navigation";
10 10
11 -export default class ProtectGod extends Component { 11 +import Home from "./src/pages/Home/index";
  12 +import InsuranceCircle from "./src/pages/InsuranceCircle/index";
  13 +import InsuranceChurch from "./src/pages/InsuranceChurch/index";
  14 +import Mine from "./src/pages/Mine/index";
  15 +import Login from "./src/pages/Login";
  16 +
  17 +const MainTabBar = TabNavigator({
  18 + Home: { screen: Home, navigationOptions: { title: "首页"} },
  19 + InsuranceCircle: { screen: InsuranceCircle },
  20 + InsuranceChurch: { screen: InsuranceChurch },
  21 + Mine: { screen: Mine }
  22 +});
  23 +
  24 +class Main extends Component {
12 constructor(props) { 25 constructor(props) {
13 super(props); 26 super(props);
14 this.state = { 27 this.state = {
@@ -16,71 +29,91 @@ export default class ProtectGod extends Component { @@ -16,71 +29,91 @@ export default class ProtectGod extends Component {
16 isLogin: true 29 isLogin: true
17 }; 30 };
18 } 31 }
19 - componentWillMount() {  
20 - // console.log("componentWillMount生命周期");  
21 - // var that = this;  
22 - // return fetch(`https://devpay.brae.co/test/insurance/login`,{  
23 - // method: "POST",  
24 - // headers: {  
25 - // 'Accept': 'application/json',  
26 - // 'Content-Type': 'application/json',  
27 - // },  
28 - // })  
29 - // .then((resp) => {  
30 - // console.log("测试接口",resp);  
31 - // // return false;  
32 - // if (resp.status === 200) {  
33 - // return resp.json();  
34 - // } else {  
35 - // console.error("something went wrong!");  
36 - // }  
37 - // })  
38 - // .then((respJson) => {  
39 - // if (respJson.enmsg != 'ok') {  
40 - // console.error(err);  
41 - // alert(respJson.cnmsg);  
42 - // } else {  
43 - // that.setState({  
44 - // testData: respJson.data  
45 - // });  
46 - // console.log('state.testData',that.state.testData);  
47 - // }  
48 - // })  
49 - // .catch((err) => console.error(err))  
50 - }  
51 -  
52 render() { 32 render() {
53 - console.log("看看这个登录state", this.state.isLogin); 33 + const { isLogin } = this.state;
54 - return this.state.isLoading ? null : ( 34 + return isLogin ? (
55 - <Main 35 + <MainTabBar />
56 - loginSuccess={this.state.isLogin} 36 + ) : (
57 - selectedItem={this.state.selectedItem} 37 + <Login
58 - onLogin={isLogin => { 38 + loginSuccess={this.props.loginSuccess}
59 - this.setState({ 39 + onLogin={this.props.onLogin}
60 - isLogin: isLogin  
61 - });  
62 - }}  
63 /> 40 />
64 ); 41 );
65 } 42 }
66 } 43 }
67 44
  45 +const ProtectGod = StackNavigator({
  46 + Main: { screen: Main },
  47 + Home: { screen: Home, navigationOptions: { headerTitle: "首页"} },
  48 + InsuranceCircle: { screen: InsuranceCircle },
  49 + InsuranceChurch: { screen: InsuranceChurch },
  50 + Mine: { screen: Mine },
  51 + Login: { screen: Login }
  52 +});
  53 +
  54 +// export default class ProtectGod extends Component {
  55 +// constructor(props) {
  56 +// super(props);
  57 +// this.state = {
  58 +// isLoading: false,
  59 +// isLogin: true
  60 +// };
  61 +// }
  62 +// componentWillMount() {
  63 +// // console.log("componentWillMount生命周期");
  64 +// // var that = this;
  65 +// // return fetch(`https://devpay.brae.co/test/insurance/login`,{
  66 +// // method: "POST",
  67 +// // headers: {
  68 +// // 'Accept': 'application/json',
  69 +// // 'Content-Type': 'application/json',
  70 +// // },
  71 +// // })
  72 +// // .then((resp) => {
  73 +// // console.log("测试接口",resp);
  74 +// // // return false;
  75 +// // if (resp.status === 200) {
  76 +// // return resp.json();
  77 +// // } else {
  78 +// // console.error("something went wrong!");
  79 +// // }
  80 +// // })
  81 +// // .then((respJson) => {
  82 +// // if (respJson.enmsg != 'ok') {
  83 +// // console.error(err);
  84 +// // alert(respJson.cnmsg);
  85 +// // } else {
  86 +// // that.setState({
  87 +// // testData: respJson.data
  88 +// // });
  89 +// // console.log('state.testData',that.state.testData);
  90 +// // }
  91 +// // })
  92 +// // .catch((err) => console.error(err))
  93 +// }
  94 +
  95 +// render() {
  96 +// console.log("看看这个登录state", this.state.isLogin);
  97 +// return this.state.isLoading ? null : (
  98 +// <Main
  99 +// loginSuccess={this.state.isLogin}
  100 +// selectedItem={this.state.selectedItem}
  101 +// onLogin={isLogin => {
  102 +// this.setState({
  103 +// isLogin: isLogin
  104 +// });
  105 +// }}
  106 +// />
  107 +// );
  108 +// }
  109 +// }
  110 +
68 const styles = StyleSheet.create({ 111 const styles = StyleSheet.create({
69 container: { 112 container: {
70 flex: 1, 113 flex: 1,
71 justifyContent: "center", 114 justifyContent: "center",
72 alignItems: "center", 115 alignItems: "center",
73 backgroundColor: "#F5FCFF" 116 backgroundColor: "#F5FCFF"
74 - },  
75 - welcome: {  
76 - fontSize: 20,  
77 - textAlign: "center",  
78 - margin: 10  
79 - },  
80 - instructions: {  
81 - textAlign: "center",  
82 - color: "#333333",  
83 - marginBottom: 5  
84 } 117 }
85 }); 118 });
86 119
@@ -9,7 +9,8 @@ @@ -9,7 +9,8 @@
9 "dependencies": { 9 "dependencies": {
10 "react": "16.0.0-alpha.12", 10 "react": "16.0.0-alpha.12",
11 "react-native": "0.48.1", 11 "react-native": "0.48.1",
12 - "react-native-swiper": "^1.5.11" 12 + "react-native-swiper": "^1.5.11",
  13 + "react-navigation": "^1.0.0-beta.11"
13 }, 14 },
14 "devDependencies": { 15 "devDependencies": {
15 "babel-jest": "20.0.3", 16 "babel-jest": "20.0.3",
@@ -8,12 +8,15 @@ import { @@ -8,12 +8,15 @@ import {
8 TouchableOpacity, 8 TouchableOpacity,
9 ScrollView 9 ScrollView
10 } from "react-native"; 10 } from "react-native";
  11 +import { StackNavigator, TabNavigator } from 'react-navigation';
11 import Swiper from "react-native-swiper"; 12 import Swiper from "react-native-swiper";
12 -import Carousel from "../../Components/Carousel";  
13 import AllProduct from "./allProduct"; 13 import AllProduct from "./allProduct";
14 import CommonWebView from "../../Components/CommonWebView"; 14 import CommonWebView from "../../Components/CommonWebView";
15 15
16 export default class Home extends Component { 16 export default class Home extends Component {
  17 + static navigationOptions = {
  18 + title: '首页',
  19 + };
17 constructor(props) { 20 constructor(props) {
18 super(props); 21 super(props);
19 this._renderMap = this._renderMap.bind(this); 22 this._renderMap = this._renderMap.bind(this);
@@ -149,8 +152,8 @@ export default class Home extends Component { @@ -149,8 +152,8 @@ export default class Home extends Component {
149 </View> 152 </View>
150 ); 153 );
151 } 154 }
152 -  
153 render() { 155 render() {
  156 + const { navigate } = this.props.navigation;
154 return ( 157 return (
155 <View style={styles.container}> 158 <View style={styles.container}>
156 {/* <Carousel /> */} 159 {/* <Carousel /> */}
@@ -189,7 +192,7 @@ export default class Home extends Component { @@ -189,7 +192,7 @@ export default class Home extends Component {
189 const styles = StyleSheet.create({ 192 const styles = StyleSheet.create({
190 container: { 193 container: {
191 flex: 1, 194 flex: 1,
192 - paddingTop: 64, 195 + // paddingTop: 64,
193 justifyContent: "flex-start", 196 justifyContent: "flex-start",
194 alignItems: "stretch", 197 alignItems: "stretch",
195 backgroundColor: "#EFEFEF" 198 backgroundColor: "#EFEFEF"
@@ -237,7 +240,7 @@ const styles = StyleSheet.create({ @@ -237,7 +240,7 @@ const styles = StyleSheet.create({
237 // height: 150 240 // height: 150
238 flex: 1, 241 flex: 1,
239 // paddingBottom: 64, 242 // paddingBottom: 64,
240 - marginBottom: 49 243 + // marginBottom: 49
241 }, 244 },
242 itemContainer: { 245 itemContainer: {
243 height: 90, 246 height: 90,
@@ -276,6 +279,6 @@ const styles = StyleSheet.create({ @@ -276,6 +279,6 @@ const styles = StyleSheet.create({
276 fontSize: 13, 279 fontSize: 13,
277 marginTop: 10, 280 marginTop: 10,
278 textAlign: "center", 281 textAlign: "center",
279 - marginBottom: 10 282 + // marginBottom: 10
280 } 283 }
281 }); 284 });
@@ -8,9 +8,13 @@ import { @@ -8,9 +8,13 @@ import {
8 TouchableOpacity, 8 TouchableOpacity,
9 Image 9 Image
10 } from "react-native"; 10 } from "react-native";
  11 +import { StackNavigator, TabNavigator } from 'react-navigation';
11 import CommonWebView from "../../Components/CommonWebView"; 12 import CommonWebView from "../../Components/CommonWebView";
12 13
13 export default class InsuranceChurch extends Component { 14 export default class InsuranceChurch extends Component {
  15 + static navigationOptions = {
  16 + title: '保堂',
  17 + };
14 constructor(props) { 18 constructor(props) {
15 super(props); 19 super(props);
16 // this._renderMap = this._renderMap.bind(this); 20 // this._renderMap = this._renderMap.bind(this);
@@ -88,7 +92,6 @@ const styles = StyleSheet.create({ @@ -88,7 +92,6 @@ const styles = StyleSheet.create({
88 justifyContent: "flex-start", 92 justifyContent: "flex-start",
89 alignItems: "stretch", 93 alignItems: "stretch",
90 backgroundColor: "#EFEFEF", 94 backgroundColor: "#EFEFEF",
91 - paddingTop: 64  
92 }, 95 },
93 scrollViewContainer: { 96 scrollViewContainer: {
94 // height: 300 97 // height: 300
@@ -8,10 +8,14 @@ import { @@ -8,10 +8,14 @@ import {
8 TouchableOpacity, 8 TouchableOpacity,
9 Image 9 Image
10 } from "react-native"; 10 } from "react-native";
  11 +import { StackNavigator, TabNavigator } from 'react-navigation';
11 import CommonWebView from "../../Components/CommonWebView"; 12 import CommonWebView from "../../Components/CommonWebView";
12 import Details from "./details"; 13 import Details from "./details";
13 14
14 export default class InsuranceCircle extends Component { 15 export default class InsuranceCircle extends Component {
  16 + static navigationOptions = {
  17 + title: '保圈',
  18 + };
15 constructor(props) { 19 constructor(props) {
16 super(props); 20 super(props);
17 this.state = { 21 this.state = {
@@ -157,12 +161,11 @@ const styles = StyleSheet.create({ @@ -157,12 +161,11 @@ const styles = StyleSheet.create({
157 justifyContent: "flex-start", 161 justifyContent: "flex-start",
158 alignItems: "stretch", 162 alignItems: "stretch",
159 backgroundColor: "#EFEFEF", 163 backgroundColor: "#EFEFEF",
160 - paddingTop: 64  
161 }, 164 },
162 scrollViewContainer: { 165 scrollViewContainer: {
163 // height: 300 166 // height: 300
164 flex: 1, 167 flex: 1,
165 - marginBottom: 49, 168 + // marginBottom: 49,
166 }, 169 },
167 scrollViewText: { 170 scrollViewText: {
168 color: "#7A7A7A", 171 color: "#7A7A7A",
1 -import React, { Component } from "react";  
2 -import {  
3 - AppRegistry,  
4 - StyleSheet,  
5 - Text,  
6 - View,  
7 - ScrollView,  
8 - TouchableOpacity,  
9 - Image  
10 -} from "react-native";  
11 -  
12 -export default class MsgNotification extends Component {  
13 - constructor(props) {  
14 - super(props);  
15 - this.state = {  
16 - ListData: [{  
17 - icon: require("../../assets/Mine/iconpic1.png"),  
18 - title: "评论回复",  
19 - time: "10小时前",  
20 - tips: "XXX回复了你的评论，点击查看",  
21 - },{  
22 - icon: require("../../assets/Mine/iconpic1.png"),  
23 - title: "评论回复",  
24 - time: "10小时前",  
25 - tips: "XXX回复了你的评论，点击查看",  
26 - },{  
27 - icon: require("../../assets/Mine/iconpic1.png"),  
28 - title: "评论回复",  
29 - time: "10小时前",  
30 - tips: "XXX回复了你的评论，点击查看",  
31 - },{  
32 - icon: require("../../assets/Mine/iconpic1.png"),  
33 - title: "评论回复",  
34 - time: "10小时前",  
35 - tips: "XXX回复了你的评论，点击查看",  
36 - }],  
37 - };  
38 - }  
39 -  
40 - render() {  
41 - return (  
42 - <View style={styles.container}>  
43 - {this.state.ListData.map((item, index) => {  
44 - return (  
45 - <TouchableOpacity style={styles.itemContainer} key={index}>  
46 - <Image style={styles.itemIcon} source={item.icon} />  
47 - <View style={styles.itemLeft}>  
48 - <View style={styles.itemLeftTop}>  
49 - <Text style={styles.itemTitle}>{item.title}</Text>  
50 - <Text style={styles.itemTime}>{item.time}</Text>  
51 - </View>  
52 - <Text style={styles.itemTips}>{item.tips}</Text>  
53 - </View>  
54 - </TouchableOpacity>  
55 - )  
56 - })}  
57 - </View>  
58 - );  
59 - }  
60 -}  
61 -  
62 -const styles = StyleSheet.create({  
63 - container: {  
64 - flex: 1,  
65 - justifyContent: "flex-start",  
66 - alignItems: "stretch",  
67 - backgroundColor: "#EFEFEF",  
68 - paddingTop: 74  
69 - },  
70 - itemContainer: {  
71 - flexDirection: "row",  
72 - alignItems: "center",  
73 - height: 72,  
74 - padding: 13,  
75 - backgroundColor: "white",  
76 - marginBottom: 1,  
77 - },  
78 - itemIcon: {  
79 - width: 46,  
80 - height: 46,  
81 - marginRight: 13,  
82 - },  
83 - itemLeft: {  
84 - flex: 1  
85 - },  
86 - itemLeftTop: {  
87 - flexDirection: "row",  
88 - alignItems: "center",  
89 - justifyContent: "space-between",  
90 - },  
91 - itemTitle: {  
92 - fontSize: 16,  
93 - color: "#030303"  
94 - },  
95 - itemTime: {  
96 - fontSize: 13,  
97 - color: "#999999"  
98 - },  
99 - itemTips: {  
100 - marginTop: 3,  
101 - fontSize: 13,  
102 - color: "#7A7A7A"  
103 - },  
104 -});  
1 -import React, { Component } from "react";  
2 -import {  
3 - AppRegistry,  
4 - StyleSheet,  
5 - Text,  
6 - View,  
7 - ScrollView,  
8 - TextInput,  
9 - TouchableOpacity,  
10 - TouchableHighlight,  
11 - Image,  
12 - Modal  
13 -} from "react-native";  
14 -  
15 -export default class PersonalInfo extends Component {  
16 - constructor(props) {  
17 - super(props);  
18 - this.state = {  
19 - modalVisible: false,  
20 - title: "更改昵称",  
21 - type: "name",  
22 - text: "",  
23 - name: this.props.name,  
24 - identity: this.props.identity,  
25 - };  
26 - }  
27 -  
28 - setModalVisible(visible,type) {  
29 - this.setState({ modalVisible: visible });  
30 - this.setState({  
31 - type: type,  
32 - title: type == "name" ? "更改昵称" : "更改职业"  
33 - })  
34 - }  
35 - confirmChange() {  
36 - console.log("看看拿到方法没",this);  
37 - if (this.state.type == "name") {  
38 - this.setState({name: this.state.text})  
39 - } else {  
40 - this.setState({identity: this.state.text})  
41 - }  
42 - this.setState({  
43 - modalVisible: false,  
44 - });  
45 - // 修改mine组件的属性值，该方法是从mine组件传过来的  
46 - this.props.changeInfo(this.state.type,this.state.text);  
47 - }  
48 - render() {  
49 - const { name, identity } = this.state;  
50 - return (  
51 - <View style={styles.container}>  
52 - <TouchableOpacity  
53 - style={styles.itemContainer}  
54 - onPress={() => {  
55 - this.setModalVisible(true,"name");  
56 - }}  
57 - >  
58 - <Text style={styles.itemLeft}>昵称</Text>  
59 - <View style={styles.itemRight}>  
60 - <Text style={styles.itemContent}>{name}</Text>  
61 - <Image  
62 - style={styles.itemArrow}  
63 - source={require("../../assets/Mine/rightArrow_gray.png")}  
64 - />  
65 - </View>  
66 - </TouchableOpacity>  
67 - <TouchableOpacity  
68 - style={styles.itemContainer}  
69 - onPress={() => {  
70 - this.setModalVisible(true,"identity");  
71 - }}  
72 - >  
73 - <Text style={styles.itemLeft}>职业</Text>  
74 - <View style={styles.itemRight}>  
75 - <Text style={styles.itemContent}>{identity}</Text>  
76 - <Image  
77 - style={styles.itemArrow}  
78 - source={require("../../assets/Mine/rightArrow_gray.png")}  
79 - />  
80 - </View>  
81 - </TouchableOpacity>  
82 -  
83 - {/* 弹出框 */}  
84 - <Modal  
85 - animationType={"slide"}  
86 - transparent={true}  
87 - visible={this.state.modalVisible}  
88 - >  
89 - <View style={styles.modalConatier}>  
90 - <View style={styles.modalWrapper}>  
91 - <Text style={styles.title}>{this.state.title}</Text>  
92 - <TextInput  
93 - style={styles.textInput}  
94 - autoFocus={true}  
95 - value={this.state.text}  
96 - onChangeText={ text => this.setState({ text })}  
97 - selectionColor="#0076FF"  
98 - clearTextOnFocus={true}  
99 - numberOfLines={1}  
100 - clearButtonMode="always"  
101 - keyboardType="default"  
102 - />  
103 - <View style={styles.btns}>  
104 - <TouchableOpacity  
105 - style={styles.btn}  
106 - onPress={() => {  
107 - this.setModalVisible(!this.state.modalVisible);  
108 - }}  
109 - >  
110 - <Text style={styles.btnText}>取消</Text>  
111 - </TouchableOpacity>  
112 - <TouchableOpacity  
113 - style={styles.btn}  
114 - onPress={() => {  
115 - this.confirmChange()  
116 - }}  
117 - >  
118 - <Text style={styles.btnText}>确定</Text>  
119 - </TouchableOpacity>  
120 - </View>  
121 - </View>  
122 - </View>  
123 - </Modal>  
124 - </View>  
125 - );  
126 - }  
127 -}  
128 -  
129 -const styles = StyleSheet.create({  
130 - container: {  
131 - flex: 1,  
132 - justifyContent: "flex-start",  
133 - alignItems: "stretch",  
134 - backgroundColor: "#EFEFEF",  
135 - paddingTop: 74  
136 - },  
137 - itemContainer: {  
138 - flexDirection: "row",  
139 - alignItems: "center",  
140 - justifyContent: "space-between",  
141 - paddingLeft: 16,  
142 - paddingRight: 16,  
143 - paddingTop: 13,  
144 - paddingBottom: 13,  
145 - marginBottom: 1,  
146 - backgroundColor: "white"  
147 - },  
148 - itemLeft: {  
149 - fontSize: 15,  
150 - color: "#242424"  
151 - },  
152 - itemRight: {  
153 - flexDirection: "row",  
154 - alignItems: "center"  
155 - },  
156 - itemContent: {  
157 - fontSize: 15,  
158 - color: "#7A7A7A",  
159 - marginRight: 6  
160 - },  
161 - itemArrow: {  
162 - width: 14,  
163 - height: 14  
164 - },  
165 - modalConatier: {  
166 - alignItems: "center",  
167 - justifyContent: "center",  
168 - flex: 1,  
169 - backgroundColor: "rgba(0, 0, 0, 0.5)"  
170 - },  
171 - modalWrapper: {  
172 - width: 270,  
173 - height: 180,  
174 - borderRadius: 10,  
175 - backgroundColor: "white",  
176 - // paddingLeft: 20,  
177 - // paddingRight: 20,  
178 - paddingBottom: 10,  
179 - justifyContent: "center",  
180 - alignItems: "center",  
181 - },  
182 - title: {  
183 - fontSize: 17,  
184 - color: "#030303",  
185 - marginLeft: 20,  
186 - position: "absolute",  
187 - top: 38,  
188 - left: 20  
189 - },  
190 - textInput: {  
191 - marginTop: 20,  
192 - marginLeft: 20,  
193 - marginRight: 20,  
194 - width: 150,  
195 - borderStyle: "solid",  
196 - borderColor: "#ccc",  
197 - borderBottomWidth: 0.5,  
198 - },  
199 - btns: {  
200 - position: "absolute",  
201 - bottom: 0,  
202 - height: 44,  
203 - flexDirection: "row",  
204 - borderStyle: "solid",  
205 - borderColor: "#ccc",  
206 - borderTopWidth: 0.5,  
207 - },  
208 - btn: {  
209 - width: 135,  
210 - height: 44,  
211 - justifyContent: "center",  
212 - alignItems: "center",  
213 - borderStyle: "solid",  
214 - borderColor: "#ccc",  
215 - borderLeftWidth: 0.5,  
216 - },  
217 - btnText: {  
218 - color: "#0076FF",  
219 - fontSize: 17,  
220 - }  
221 -});  
@@ -8,8 +8,12 @@ import { @@ -8,8 +8,12 @@ import {
8 Image, 8 Image,
9 AlertIOS 9 AlertIOS
10 } from "react-native"; 10 } from "react-native";
  11 +import { StackNavigator, TabNavigator } from 'react-navigation';
11 12
12 export default class Mine extends Component { 13 export default class Mine extends Component {
  14 + static navigationOptions = {
  15 + title: '我的',
  16 + };
13 constructor(props) { 17 constructor(props) {
14 super(props); 18 super(props);
15 this.state = { 19 this.state = {
@@ -104,7 +108,6 @@ const styles = StyleSheet.create({ @@ -104,7 +108,6 @@ const styles = StyleSheet.create({
104 justifyContent: "flex-start", 108 justifyContent: "flex-start",
105 alignItems: "stretch", 109 alignItems: "stretch",
106 backgroundColor: "#EFEFEF", 110 backgroundColor: "#EFEFEF",
107 - paddingTop: 64  
108 }, 111 },
109 header: { 112 header: {
110 backgroundColor: "#1B9341", 113 backgroundColor: "#1B9341",
1 -import React, { Component } from "react";  
2 -import {  
3 - AppRegistry,  
4 - StyleSheet,  
5 - Text,  
6 - View,  
7 - ScrollView,  
8 - TouchableOpacity,  
9 - Image  
10 -} from "react-native";  
11 -  
12 -export default class MyQuestion extends Component {  
13 - constructor(props) {  
14 - super(props);  
15 - this.state = {  
16 - ListData: [  
17 - {  
18 - title: "家庭经济越差越应该买保险，因为你病不起，输不起，也折腾不起…",  
19 - content:  
20 - "现实生活就是如此矛盾现实生活，就是如此矛盾现实生活就是如此矛盾现实生活就是如此矛盾现实生活就是如此矛盾现实生活就是如此矛盾现实矛是如此此…",  
21 - name: "嘿嘿嘿",  
22 - identity: "保险代理人",  
23 - image: require("../../assets/Mine/iconpic1.png"),  
24 - num: "30",  
25 - time: "2017-8-15",  
26 - comments: [{  
27 - replyer: "噢噢噢",  
28 - replayicon: require("../../assets/Mine/iconpic1.png"),  
29 - beenreplyer: "嘿嘿嘿",  
30 - content: "生活就是如此矛是如此此生活就是如此矛盾现实生活就是如此矛盾现",  
31 - time: "两小时前",  
32 - },{  
33 - replyer: "哦哦哦",  
34 - replayicon: require("../../assets/Mine/iconpic1.png"),  
35 - beenreplyer: "哈哈哈",  
36 - content: "生活就是如此矛是如此此生活就是如此矛盾现实生活就是如此矛盾现",  
37 - time: "两小时前",  
38 - },{  
39 - replyer: "洛洛洛",  
40 - replayicon: require("../../assets/Mine/iconpic1.png"),  
41 - beenreplyer: "额额额",  
42 - content: "生活就是如此矛是如此此生活就是如此矛盾现实生活就是如此矛盾现",  
43 - time: "两小时前",  
44 - }],  
45 - },  
46 - {  
47 - title: "家庭经济越差越应该买保险，因为你病不起，输不起，也折腾不起…",  
48 - content:  
49 - "现实生活就是如此矛盾现实生活，就是如此矛盾现实生活就是如此矛盾现实生活就是如此矛盾现实生活就是如此矛盾现实生活就是如此矛盾现实矛是如此此…",  
50 - name: "嘿嘿嘿",  
51 - identity: "保险代理人",  
52 - image: require("../../assets/circle/newspic.png"),  
53 - num: "29",  
54 - time: "2017-8-15",  
55 - comments: []  
56 - },  
57 - {  
58 - title: "因为你病不起，输不起，也折腾不起…",  
59 - content:  
60 - "现实生活就是如此矛盾现实生活，就是如此矛盾现实生活就是如此矛盾现实生活，就是如此矛盾现实生活就是如此矛盾现实生活就是如此矛盾现实生活就是如此矛盾现实生活就是如此矛盾现实矛是如此此…现实生活就是如此矛盾现实生活就是如此矛盾现实生活就是如此矛盾现实生活就是如此矛盾现实矛是如此此…",  
61 - name: "luosf",  
62 - identity: "保险代理人",  
63 - image: require("../../assets/circle/newspic.png"),  
64 - num: "10",  
65 - time: "2017-8-15",  
66 - comments: []  
67 - }  
68 - ],  
69 - testData: [],  
70 - };  
71 - }  
72 -  
73 - // componentWillMount() {  
74 - // var that = this;  
75 - // return fetch(`https://mpay.brae.co/test/insurance/article`,{  
76 - // method: "POST",  
77 - // headers: {  
78 - // 'Accept': 'application/json',  
79 - // 'Content-Type': 'application/json',  
80 - // },  
81 - // })  
82 - // .then((resp) => {  
83 - // console.log("测试接口",resp);  
84 - // // return false;  
85 - // if (resp.status === 200) {  
86 - // return resp.json();  
87 - // } else {  
88 - // console.error("something went wrong!");  
89 - // }  
90 - // })  
91 - // .then((respJson) => {  
92 - // if (respJson.enmsg != 'ok') {  
93 - // console.error(err);  
94 - // alert(respJson.cnmsg);  
95 - // } else {  
96 - // that.setState({  
97 - // testData: respJson.data  
98 - // });  
99 - // console.log('state.testData',that.state.testData);  
100 - // }  
101 - // })  
102 - // .catch((err) => console.error(err))  
103 - // }  
104 -  
105 - render() {  
106 - return (  
107 - <View style={styles.container}>  
108 - <ScrollView  
109 - style={styles.scrollViewContainer}  
110 - automaticallyAdjustContentInsets={false}  
111 - >  
112 - {this.state.ListData.map((item, index) => {  
113 - return (  
114 - <TouchableOpacity  
115 - style={styles.itemContainer}  
116 - key={index}  
117 - >  
118 - <Text style={styles.itemTitle} numberOfLines={2}>  
119 - {item.title}  
120 - </Text>  
121 - <Text style={styles.itemContent} numberOfLines={3}>  
122 - {item.content}  
123 - </Text>  
124 - <View style={styles.itemInfoWrapper}>  
125 - <View style={styles.itemInfoLeft}>  
126 - {/* <Image  
127 - source={item.image}  
128 - style={[styles.itemInfoIcon, { width: 26, height: 26 }]}  
129 - />  
130 - <Text style={styles.itemInfoName}>{item.name}</Text> */}  
131 - </View>  
132 - <Text style={styles.itemInfoRight}>{item.num} 评论</Text>  
133 - </View>  
134 - </TouchableOpacity>  
135 - );  
136 - })}  
137 - </ScrollView>  
138 - </View>  
139 - );  
140 - }  
141 -}  
142 -  
143 -const styles = StyleSheet.create({  
144 - container: {  
145 - flex: 1,  
146 - justifyContent: "flex-start",  
147 - alignItems: "stretch",  
148 - backgroundColor: "#EFEFEF",  
149 - paddingTop: 74  
150 - },  
151 - scrollViewContainer: {  
152 - // height: 300  
153 - },  
154 - scrollViewText: {  
155 - color: "#7A7A7A",  
156 - fontSize: 13,  
157 - marginTop: 10,  
158 - textAlign: "center"  
159 - },  
160 - itemContainer: {  
161 - backgroundColor: "#fff",  
162 - marginBottom: 10,  
163 - height: 180,  
164 - paddingLeft: 13,  
165 - paddingRight: 13,  
166 - paddingTop: 19  
167 - },  
168 - itemTitle: {  
169 - fontSize: 17,  
170 - color: "#242424",  
171 - lineHeight: 24  
172 - },  
173 - itemContent: {  
174 - marginTop: 5,  
175 - fontSize: 14,  
176 - color: "#7A7A7A",  
177 - lineHeight: 20  
178 - },  
179 - itemInfoWrapper: {  
180 - flexDirection: "row",  
181 - justifyContent: "flex-end",  
182 - alignItems: "center",  
183 - marginTop: 11  
184 - },  
185 - itemInfoLeft: {  
186 - flexDirection: "row",  
187 - justifyContent: "flex-start",  
188 - alignItems: "center"  
189 - },  
190 - itemInfoIcon: {  
191 - marginRight: 10  
192 - },  
193 - itemInfoName: {  
194 - fontSize: 13,  
195 - color: "#242424",  
196 - lineHeight: 18  
197 - },  
198 - itemInfoRight: {  
199 - fontSize: 13,  
200 - color: "#999999",  
201 - lineHeight: 18  
202 - }  
203 -});  
@@ -8,6 +8,7 @@ import { @@ -8,6 +8,7 @@ import {
8 NavigatorIOS, 8 NavigatorIOS,
9 Dimensions 9 Dimensions
10 } from "react-native"; 10 } from "react-native";
  11 +import { StackNavigator, TabNavigator } from "react-navigation";
11 12
12 import Home from "./Home/index"; 13 import Home from "./Home/index";
13 import InsuranceCircle from "./InsuranceCircle/index"; 14 import InsuranceCircle from "./InsuranceCircle/index";
@@ -17,7 +18,7 @@ import Login from "./Login"; @@ -17,7 +18,7 @@ import Login from "./Login";
17 18
18 var scale = Dimensions.get("window").scale; 19 var scale = Dimensions.get("window").scale;
19 20
20 -export default class Main extends Component { 21 +class Main extends Component {
21 constructor(props) { 22 constructor(props) {
22 super(props); 23 super(props);
23 this.state = { 24 this.state = {
@@ -31,85 +32,87 @@ export default class Main extends Component { @@ -31,85 +32,87 @@ export default class Main extends Component {
31 32
32 render() { 33 render() {
33 const { loginSuccess } = this.props; 34 const { loginSuccess } = this.props;
34 - return loginSuccess ? ( 35 + return loginSuccess ? <MainTabBar navigation={this.props.navigation} />
35 - <TabBarIOS tintColor="#08CC6A" barTintColor="white"> 36 + // (
36 - <TabBarIOS.Item 37 + // <TabBarIOS tintColor="#08CC6A" barTintColor="white">
37 - title="首页" 38 + // <TabBarIOS.Item
38 - icon={require("../assets/tabbar/ic_home_n.png")} 39 + // title="首页"
39 - selected={this.state.selectedItem == "home"} 40 + // icon={require("../assets/tabbar/ic_home_n.png")}
40 - onPress={() => { 41 + // selected={this.state.selectedItem == "home"}
41 - this.setState({ 42 + // onPress={() => {
42 - selectedItem: "home" 43 + // this.setState({
43 - }); 44 + // selectedItem: "home"
44 - }} 45 + // });
45 - > 46 + // }}
46 - <NavigatorIOS 47 + // >
47 - style={{ flex: 1 }} 48 + // <NavigatorIOS
48 - initialRoute={{ 49 + // style={{ flex: 1 }}
49 - component: Home, 50 + // initialRoute={{
50 - title: "首页", 51 + // component: Home,
51 - }} 52 + // title: "首页",
52 - /> 53 + // }}
53 - </TabBarIOS.Item> 54 + // />
54 - <TabBarIOS.Item 55 + // </TabBarIOS.Item>
55 - title="保圈" 56 + // <TabBarIOS.Item
56 - icon={require("../assets/tabbar/ic_circle_n.png")} 57 + // title="保圈"
57 - selected={this.state.selectedItem == "insuranceCircle"} 58 + // icon={require("../assets/tabbar/ic_circle_n.png")}
58 - onPress={() => { 59 + // selected={this.state.selectedItem == "insuranceCircle"}
59 - this.setState({ 60 + // onPress={() => {
60 - selectedItem: "insuranceCircle" 61 + // this.setState({
61 - }); 62 + // selectedItem: "insuranceCircle"
62 - }} 63 + // });
63 - > 64 + // }}
64 - <NavigatorIOS 65 + // >
65 - style={{ flex: 1 }} 66 + // <NavigatorIOS
66 - initialRoute={{ 67 + // style={{ flex: 1 }}
67 - component: InsuranceCircle, 68 + // initialRoute={{
68 - title: "保圈", 69 + // component: InsuranceCircle,
69 - }} 70 + // title: "保圈",
70 - /> 71 + // }}
71 - </TabBarIOS.Item> 72 + // />
72 - <TabBarIOS.Item 73 + // </TabBarIOS.Item>
73 - title="保堂" 74 + // <TabBarIOS.Item
74 - icon={require("../assets/tabbar/ic_umbrella_n.png")} 75 + // title="保堂"
75 - selected={this.state.selectedItem == "insuranceChurch"} 76 + // icon={require("../assets/tabbar/ic_umbrella_n.png")}
76 - onPress={() => { 77 + // selected={this.state.selectedItem == "insuranceChurch"}
77 - this.setState({ 78 + // onPress={() => {
78 - selectedItem: "insuranceChurch" 79 + // this.setState({
79 - }); 80 + // selectedItem: "insuranceChurch"
80 - }} 81 + // });
81 - > 82 + // }}
82 - <NavigatorIOS 83 + // >
83 - style={{ flex: 1 }} 84 + // <NavigatorIOS
84 - initialRoute={{ 85 + // style={{ flex: 1 }}
85 - component: InsuranceChurch, 86 + // initialRoute={{
86 - title: "保堂" 87 + // component: InsuranceChurch,
87 - }} 88 + // title: "保堂"
88 - /> 89 + // }}
89 - </TabBarIOS.Item> 90 + // />
90 - <TabBarIOS.Item 91 + // </TabBarIOS.Item>
91 - title="我的" 92 + // <TabBarIOS.Item
92 - icon={require("../assets/tabbar/ic_mine_n.png")} 93 + // title="我的"
93 - selected={this.state.selectedItem == "mine"} 94 + // icon={require("../assets/tabbar/ic_mine_n.png")}
94 - onPress={() => { 95 + // selected={this.state.selectedItem == "mine"}
95 - this.setState({ 96 + // onPress={() => {
96 - selectedItem: "mine" 97 + // this.setState({
97 - }); 98 + // selectedItem: "mine"
98 - }} 99 + // });
99 - > 100 + // }}
100 - <NavigatorIOS 101 + // >
101 - style={{ flex: 1 }} 102 + // <NavigatorIOS
102 - initialRoute={{ 103 + // style={{ flex: 1 }}
103 - component: Mine, 104 + // initialRoute={{
104 - title: "我的", 105 + // component: Mine,
105 - passProps: { 106 + // title: "我的",
106 - onLogin: this.props.onLogin 107 + // passProps: {
107 - } 108 + // onLogin: this.props.onLogin
108 - }} 109 + // }
109 - /> 110 + // }}
110 - </TabBarIOS.Item> 111 + // />
111 - </TabBarIOS> 112 + // </TabBarIOS.Item>
112 - ) : ( 113 + // </TabBarIOS>
  114 + // )
  115 + : (
113 <Login 116 <Login
114 loginSuccess={this.props.loginSuccess} 117 loginSuccess={this.props.loginSuccess}
115 onLogin={this.props.onLogin} 118 onLogin={this.props.onLogin}
@@ -1026,6 +1026,10 @@ ci-info@^1.0.0: @@ -1026,6 +1026,10 @@ ci-info@^1.0.0:
1026 version "1.0.0" 1026 version "1.0.0"
1027 resolved "http://registry.npm.taobao.org/ci-info/download/ci-info-1.0.0.tgz#dc5285f2b4e251821683681c381c3388f46ec534" 1027 resolved "http://registry.npm.taobao.org/ci-info/download/ci-info-1.0.0.tgz#dc5285f2b4e251821683681c381c3388f46ec534"
1028 1028
  1029 +clamp@^1.0.1:
  1030 + version "1.0.1"
  1031 + resolved "http://registry.npm.taobao.org/clamp/download/clamp-1.0.1.tgz#66a0e64011816e37196828fdc8c8c147312c8634"
  1032 +
1029 cli-cursor@^2.1.0: 1033 cli-cursor@^2.1.0:
1030 version "2.1.0" 1034 version "2.1.0"
1031 resolved "http://registry.npm.taobao.org/cli-cursor/download/cli-cursor-2.1.0.tgz#b35dac376479facc3e94747d41d0d0f5238ffcb5" 1035 resolved "http://registry.npm.taobao.org/cli-cursor/download/cli-cursor-2.1.0.tgz#b35dac376479facc3e94747d41d0d0f5238ffcb5"
@@ -1521,7 +1525,7 @@ fbjs-scripts@^0.7.0: @@ -1521,7 +1525,7 @@ fbjs-scripts@^0.7.0:
1521 semver "^5.1.0" 1525 semver "^5.1.0"
1522 through2 "^2.0.0" 1526 through2 "^2.0.0"
1523 1527
1524 -fbjs@0.8.12, fbjs@^0.8.9: 1528 +fbjs@0.8.12, fbjs@^0.8.12, fbjs@^0.8.9:
1525 version "0.8.12" 1529 version "0.8.12"
1526 resolved "http://registry.npm.taobao.org/fbjs/download/fbjs-0.8.12.tgz#10b5d92f76d45575fd63a217d4ea02bea2f8ed04" 1530 resolved "http://registry.npm.taobao.org/fbjs/download/fbjs-0.8.12.tgz#10b5d92f76d45575fd63a217d4ea02bea2f8ed04"
1527 dependencies: 1531 dependencies:
@@ -1821,6 +1825,10 @@ hoek@2.x.x: @@ -1821,6 +1825,10 @@ hoek@2.x.x:
1821 version "2.16.3" 1825 version "2.16.3"
1822 resolved "http://registry.npm.taobao.org/hoek/download/hoek-2.16.3.tgz#20bb7403d3cea398e91dc4710a8ff1b8274a25ed" 1826 resolved "http://registry.npm.taobao.org/hoek/download/hoek-2.16.3.tgz#20bb7403d3cea398e91dc4710a8ff1b8274a25ed"
1823 1827
  1828 +hoist-non-react-statics@^1.2.0:
  1829 + version "1.2.0"
  1830 + resolved "http://registry.npm.taobao.org/hoist-non-react-statics/download/hoist-non-react-statics-1.2.0.tgz#aa448cf0986d55cc40773b17174b7dd066cb7cfb"
  1831 +
1824 home-or-tmp@^2.0.0: 1832 home-or-tmp@^2.0.0:
1825 version "2.0.0" 1833 version "2.0.0"
1826 resolved "http://registry.npm.taobao.org/home-or-tmp/download/home-or-tmp-2.0.0.tgz#e36c3f2d2cae7d746a857e38d18d5f32a7882db8" 1834 resolved "http://registry.npm.taobao.org/home-or-tmp/download/home-or-tmp-2.0.0.tgz#e36c3f2d2cae7d746a857e38d18d5f32a7882db8"
@@ -3059,6 +3067,12 @@ path-parse@^1.0.5: @@ -3059,6 +3067,12 @@ path-parse@^1.0.5:
3059 version "1.0.5" 3067 version "1.0.5"
3060 resolved "http://registry.npm.taobao.org/path-parse/download/path-parse-1.0.5.tgz#3c1adf871ea9cd6c9431b6ea2bd74a0ff055c4c1" 3068 resolved "http://registry.npm.taobao.org/path-parse/download/path-parse-1.0.5.tgz#3c1adf871ea9cd6c9431b6ea2bd74a0ff055c4c1"
3061 3069
  3070 +path-to-regexp@^1.7.0:
  3071 + version "1.7.0"
  3072 + resolved "http://registry.npm.taobao.org/path-to-regexp/download/path-to-regexp-1.7.0.tgz#59fde0f435badacba103a84e9d3bc64e96b9937d"
  3073 + dependencies:
  3074 + isarray "0.0.1"
  3075 +
3062 path-type@^1.0.0: 3076 path-type@^1.0.0:
3063 version "1.1.0" 3077 version "1.1.0"
3064 resolved "http://registry.npm.taobao.org/path-type/download/path-type-1.1.0.tgz#59c44f7ee491da704da415da5a4070ba4f8fe441" 3078 resolved "http://registry.npm.taobao.org/path-type/download/path-type-1.1.0.tgz#59c44f7ee491da704da415da5a4070ba4f8fe441"
@@ -3221,12 +3235,34 @@ react-devtools-core@^2.5.0: @@ -3221,12 +3235,34 @@ react-devtools-core@^2.5.0:
3221 shell-quote "^1.6.1" 3235 shell-quote "^1.6.1"
3222 ws "^2.0.3" 3236 ws "^2.0.3"
3223 3237
  3238 +react-native-dismiss-keyboard@1.0.0:
  3239 + version "1.0.0"
  3240 + resolved "http://registry.npm.taobao.org/react-native-dismiss-keyboard/download/react-native-dismiss-keyboard-1.0.0.tgz#32886242b3f2317e121f3aeb9b0a585e2b879b49"
  3241 +
  3242 +react-native-drawer-layout-polyfill@^1.3.0:
  3243 + version "1.3.2"
  3244 + resolved "http://registry.npm.taobao.org/react-native-drawer-layout-polyfill/download/react-native-drawer-layout-polyfill-1.3.2.tgz#192c84d7a5a6b8a6d2be2c7daa5e4164518d0cc7"
  3245 + dependencies:
  3246 + react-native-drawer-layout "1.3.2"
  3247 +
  3248 +react-native-drawer-layout@1.3.2:
  3249 + version "1.3.2"
  3250 + resolved "http://registry.npm.taobao.org/react-native-drawer-layout/download/react-native-drawer-layout-1.3.2.tgz#b9740d7663a1dc4f88a61b9c6d93d2d948ea426e"
  3251 + dependencies:
  3252 + react-native-dismiss-keyboard "1.0.0"
  3253 +
3224 react-native-swiper@^1.5.11: 3254 react-native-swiper@^1.5.11:
3225 version "1.5.11" 3255 version "1.5.11"
3226 resolved "http://registry.npm.taobao.org/react-native-swiper/download/react-native-swiper-1.5.11.tgz#2d46ded43f383dbde4540d513cb4eaaa60eaed61" 3256 resolved "http://registry.npm.taobao.org/react-native-swiper/download/react-native-swiper-1.5.11.tgz#2d46ded43f383dbde4540d513cb4eaaa60eaed61"
3227 dependencies: 3257 dependencies:
3228 prop-types "^15.5.10" 3258 prop-types "^15.5.10"
3229 3259
  3260 +react-native-tab-view@^0.0.65:
  3261 + version "0.0.65"
  3262 + resolved "http://registry.npm.taobao.org/react-native-tab-view/download/react-native-tab-view-0.0.65.tgz#b685ea3081ff7c96486cd997361026c407302c59"
  3263 + dependencies:
  3264 + prop-types "^15.5.8"
  3265 +
3230 react-native@0.48.1: 3266 react-native@0.48.1:
3231 version "0.48.1" 3267 version "0.48.1"
3232 resolved "http://registry.npm.taobao.org/react-native/download/react-native-0.48.1.tgz#052ba5a86d3bdb748c288124248727d02b1c0939" 3268 resolved "http://registry.npm.taobao.org/react-native/download/react-native-0.48.1.tgz#052ba5a86d3bdb748c288124248727d02b1c0939"
@@ -3315,6 +3351,18 @@ react-native@0.48.1: @@ -3315,6 +3351,18 @@ react-native@0.48.1:
3315 xtend ">=4.0.0 <4.1.0-0" 3351 xtend ">=4.0.0 <4.1.0-0"
3316 yargs "^6.4.0" 3352 yargs "^6.4.0"
3317 3353
  3354 +react-navigation@^1.0.0-beta.11:
  3355 + version "1.0.0-beta.11"
  3356 + resolved "http://registry.npm.taobao.org/react-navigation/download/react-navigation-1.0.0-beta.11.tgz#4271edb23cdbcc6eb88602f7fde0a77f0ef7a160"
  3357 + dependencies:
  3358 + clamp "^1.0.1"
  3359 + fbjs "^0.8.12"
  3360 + hoist-non-react-statics "^1.2.0"
  3361 + path-to-regexp "^1.7.0"
  3362 + prop-types "^15.5.10"
  3363 + react-native-drawer-layout-polyfill "^1.3.0"
  3364 + react-native-tab-view "^0.0.65"
  3365 +
3318 react-proxy@^1.1.7: 3366 react-proxy@^1.1.7:
3319 version "1.1.8" 3367 version "1.1.8"
3320 resolved "http://registry.npm.taobao.org/react-proxy/download/react-proxy-1.1.8.tgz#9dbfd9d927528c3aa9f444e4558c37830ab8c26a" 3368 resolved "http://registry.npm.taobao.org/react-proxy/download/react-proxy-1.1.8.tgz#9dbfd9d927528c3aa9f444e4558c37830ab8c26a"
@@ -65,4 +65,35 @@ POST https://devpay.brae.co @@ -65,4 +65,35 @@ POST https://devpay.brae.co
65 "user": "yyy", 65 "user": "yyy",
66 "content": "哈哈~" 66 "content": "哈哈~"
67 } 67 }
68 -} 68 +}
  69 +
  70 +
  71 + var that = this;
  72 + return fetch(`https://devpay.brae.co/test/insurance/login`,{
  73 + method: "POST",
  74 + headers: {
  75 + 'Accept': 'application/json',
  76 + 'Content-Type': 'application/json',
  77 + },
  78 + })
  79 + .then((resp) => {
  80 + console.log("测试接口",resp);
  81 + // return false;
  82 + if (resp.status === 200) {
  83 + return resp.json();
  84 + } else {
  85 + console.error("something went wrong!");
  86 + }
  87 + })
  88 + .then((respJson) => {
  89 + if (respJson.enmsg != 'ok') {
  90 + console.error(err);
  91 + alert(respJson.cnmsg);
  92 + } else {
  93 + that.setState({
  94 + testData: respJson.data
  95 + });
  96 + console.log('state.testData',that.state.testData);
  97 + }
  98 + })
  99 + .catch((err) => console.error(err))