新增list点击时间

Author: z50902677

src/actions/listViewActions.js

@@ -0,0 +1,36 @@
+/**
+ * Created by zhaohang on 2016/7/28.
+ */
+
+import { createAction } from 'redux-actions';
+import listViewActionEnum from '../constants/listViewActionEnum'
+import { api, callApi } from '../apis/api'
+import { Actions } from "react-native-router-flux";
+const listViewActions = {
+    setListView:createAction(listViewActionEnum.SET_LIST_VIEW),
+    toDesOfList: (data)=> {
+        return dispatch=> {
+            dispatch(
+                listViewActions.setListView(data)
+            );
+        }
+    },
+    getListRequest: (data)=> {
+        return dispatch=> {
+            callApi(
+                api.allList(data),
+                (data)=>dispatch(listViewActions.requestListSuccess(data)),
+                (err)=>console.warn(err)
+            );
+        }
+    },
+    requestListSuccess: (data)=> {
+        return dispatch=> {
+            dispatch(
+                listViewActions.setListView(data)
+            );
+        }
+    }
+};
+
+export default listViewActions;

src/apis/api.js

@@ -6,6 +6,11 @@ const api = {
         `${appConfig.serviceRoot}app/login`,
         fetchMethod.Get,
         {parameter: parameter}
+    ),
+    allList: (parameter)=> createFetch(
+        `${appConfig.serviceRoot}app/listAll`,
+        fetchMethod.Get,
+        {parameter: parameter}
     )
 };
 

src/constants/appConfig.js

@@ -1,5 +1,5 @@
 const appConfig = {
-    serviceRoot: 'http://172.23.61.139:3000/'
+    serviceRoot: 'http://172.23.61.142:3000/'
 };
 
 export default appConfig;

src/constants/listViewActionEnum.js

@@ -0,0 +1,8 @@
+/**
+ * Created by zhaohang on 2016/7/28.
+ */
+const listViewActionEnum = {
+    SET_LIST_VIEW: 'SET_LIST_VIEW'
+};
+
+export default listViewActionEnum;

src/containers/android/ListView.js

@@ -2,11 +2,11 @@
  * Created by zhaohang on 2016/7/25.
  */
 import React ,{Component}from 'react';
-import {View, Text, StyleSheet,TextInput,Image,ListView} from "react-native";
+import {View, Text, StyleSheet,TextInput,Image,ListView,TouchableHighlight} from "react-native";
 import { connect } from 'react-redux'
 import Button from "react-native-button";
 import Swipeout  from "react-native-swipeout";
-import loginActions from '../../actions/loginActions'
+import listViewActions from '../../actions/listViewActions'
 import  {bindActionCreators} from 'redux'
 const styles = StyleSheet.create({
     row: {
@@ -34,27 +34,42 @@ const styles = StyleSheet.create({
 class listView extends Component {
     constructor(props) {
         super(props);
-        let ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
+        //let ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
         this.state = {
-            dataSource :ds.cloneWithRows([{
-                url: '../image/logo.png', title: '第四代活塞,谁发的第四代活塞,谁发的第四代活塞,谁发的', author: '张三', data: '2016-01-01'
-            }, {
-                url: '/src/image/login.png',
-                title: '库克将怒火几年级',
-                author: 'lily',
-                data: '2016-08-08'
-            }])
+
         };
+        this.getAllList = this.getAllList.bind(this);
+        this.pressRow = this.pressRow.bind(this);
+    }
+    componentWillReceiveProps(nextProps) {
+        this.setState({
+
+        });
+    }
+
+    componentWillMount() {
+        //控件加载的时候先发起服务请求
+        this.props.getListRequest(1);
+    }
+    pressRow(id) {
+        this.props.toDesOfList(id);
+    }
+    getAllList(aa) {
+        alert(aa);
     }
     render() {
+       let data = this.props.state.listData;
+       let ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
+       let dataSource = ds.cloneWithRows(data);
         return (
-            <ListView
-                dataSource={this.state.dataSource}
+            <ListView  enableEmptySections = {true} onEndReached = {this.getAllList} onEndReachedThreshold = {20}
+                       dataSource={dataSource}
                 renderRow={(rowData) =>
-            <Swipeout right={[{text:'删除',backgroundColor:'red'}]} backgroundColor={'#FFF'}>
+                 <Swipeout right={[{text:'删除',backgroundColor:'red'}]} backgroundColor={'#FFF'}>
+                 <TouchableHighlight onPress={() => this.pressRow(rowData.id)}>
                 <View style={styles.row}>
                     <View>
-                        <Image style={styles.thumb} source={require('../../image/login.png')} />
+                        <Image style={styles.thumb} source={{uri:rowData.image}} />
                     </View>
                     <View>
                         <View>
@@ -64,12 +79,15 @@ class listView extends Component {
                         </View>
                         <View>
                              <Text style={styles.desc}>
-                                  {rowData.author}  {rowData.data}
+                                  {rowData.author}  {rowData.date}
                              </Text>
                         </View>
                     </View>
                 </View>
+                </TouchableHighlight>
             </Swipeout>
+
+
             }
             />
         );
@@ -78,13 +96,12 @@ class listView extends Component {
 
 function mapStateToProps(state) {
     return {
-        state:{
-        }
+        state:state.listViewReducer
     }
 }
 
 function mapDispatchToProps(dispatch) {
-    return bindActionCreators(loginActions, dispatch);
+    return bindActionCreators(listViewActions, dispatch);
 }
 
 export default connect(

src/containers/android/app.js

@@ -32,7 +32,7 @@ class App extends React.Component {
                             <Scene key="main" direction="vertical" component={main} title="Main"
                                    hideNavBar/>
                             <Scene key="ListView" direction="vertical" component={ListView} title="ListView"
-                                   hideNavBar/>
+                                                       hideNavBar/>
                         </Scene>
                         <Scene key="error" component={Error}/>
                     </Scene>

src/reducers/listViewReducer.js

@@ -0,0 +1,20 @@
+/**
+ * Created by zhaohang on 2016/7/28.
+ */
+import { handleActions } from 'redux-actions'
+import listViewActions  from '../actions/listViewActions'
+import {ListView} from "react-native";
+const initialState = {
+    listData :[]
+};
+
+const loginReducer = handleActions({
+    [listViewActions.setListView]: (state, action) => {
+        state = Object.assign({}, state);
+        state.listData = action.payload;
+        return state;
+    }
+
+}, initialState);
+
+export default loginReducer;

src/reducers/rootReducer.js

@@ -3,10 +3,11 @@
  */
 import { combineReducers } from 'redux';
 import loginReducer from './loginReducer';
+import listViewReducer from './listViewReducer';
 // ... other reducers
 
 const rootReducer = combineReducers({
-    loginReducer
+    loginReducer,listViewReducer
     // ... other reducers
 });