const fetchDataReducer = (state = initState, action) => {
switch (action.type) {
case FETCH_REQUEST:
return state;
case FETCH_SUCCESS:
return {
...state,
companyData: action.company_list,
};
case FETCH_ERROR:
return {
...state,
companyData: action.payload,
};
case GET_SOCKET_DATA:
return {
...state,
companyData: state.carFilterMode ? state.companyData : mergeSocketData(state.companyData, action.socketData),
// companyDataImm: state.carFilterMode ? state.companyData : mergeSocketData(state.companyData, action.socketData)
};
case CAR_FILTER:
console.log(state)
return {
...state,
carFilterMode: true,
companyData: state.companyData.filter((item) => item.n.toLowerCase().indexOf(action.text.toLowerCase()) > -1)
};
default:
return state
}
};чтоб клиенты только принимали пакеты данных, а сами запросов не делали. Пришёл типа json - разпарсить его только и поприменять по конечному назначению
import React, {Component} from 'react';
import TableCarList from './TableCarList'
import TextField from 'material-ui/TextField';
const iconStyles = {
marginRight: 5,
width: 20,
height: 20
// height: `10px`,
};
export default class SelectAutoComplete extends Component {
constructor(props) {
super(props);
this.state = {
filterText: ''
}
}
carFiltering = (event, text) => {
// this.props.filterCars(text);
this.setState({
filterText: text
})
this.props.filterCars(text);
};
render() {
const dataSourceConfig = {
text: 'text',
value: 'id',
};
return (
<div>
<TextField hintText="Find Your car..." onChange={this.carFiltering} value={this.state.filterText}/>
<TableCarList options={this.props.selectedCompany.carList} data={this.props.company.companyData}/>
</div>
);
}
}//Action
export const filterCars = (text) => ({
type: types.CAR_FILTER,
text
});
// Reducer
const fetchDataReducer = (state = initState, action) => {
switch (action.type) {
case FETCH_REQUEST:
return state;
case FETCH_SUCCESS:
return {
...state,
companyData: action.company_list,
loaded: true,
};
case FETCH_INTERVAL_SUCCESS:
return {
...state,
companyData: mergeData(state.companyData, action.company_list),
loaded: true
};
case FETCH_ERROR:
return {
...state,
companyData: action.payload,
loaded: true
};
case CAR_FILTER:
console.log('CAR_FILTER', action);
return {
...state,
// companyData: state.companyData.filter(item => item.n ),
};
default:
return state
}
};
// Parent component
// может проблема здесь? так как сейчас я пока ничего не фильтрую
const mapStateToProps = (state) => {
return {
selectedCompany: state.selectedCompanyReducer,
}
};
const mapDispatchToProps = (dispatch) => {
return {
selectCompany: bindActionCreators(selectCompany, dispatch),
filterCars: bindActionCreators(filterCars, dispatch)
}
};
export default connect(mapStateToProps, mapDispatchToProps)(Sidebar)