import React from "react";
import { connect } from "react-redux";
import { actionGreen, actionRed } from "../../actions/counter";
const Counter = ({ actionRed,actionGreen, state }) => {
return (
<div>
<button onClick={actionRed} style={{backgroundColor: state}}>Red</button>
<button onClick={actionGreen} style={{backgroundColor: state}}>Green</button>
</div>
);
}
const mapStateToProps = (state) => ({state });
const mapDispatchToProps = {
actionRed,
actionGreen
};
export const CounterContainer = connect(mapStateToProps, mapDispatchToProps)(Counter);
=========
const initialColor ={
background: 'white'
}
const initialRed ={
background: 'red'
}
const initialGreen ={
background: 'green'
}
export const counterReducer = (state=initialColor.background, action) => {
switch(action.type) {
case "RED": {
return {
state:initialRed.background
};
}
case "GREEN": {
return {
state:initialGreen.background
}
}
default: {
return state;
}
}
};dataa && l.userId === dataa.idconst deleteUser = () => {
axios.get(`http://localhost:3001/users/${user.id}`)
.then(({ data }) => {
const userData = data
console.log(userData)
axios.get(`http://localhost:3001/lists`)
.then(({ data }) => {
data.map(l => {
if(userData && l.userId === userData.id){
console.log(l)
}
})
})
})
.catch(e => {
alert('Ошибка');
})
}export const setActiveUser = clientsList => {
return {
type: SET_ACTIVE_USER,
clientsList: ""
};
};export const setActiveUser = activeClient => {
return {
type: SET_ACTIVE_USER,
payload: activeClient
};
};export const initialState = {
users: [],
activeUser: null,
filter: ""
};export const getUsers = clientsList => {
return {
type: GET_USERS,
clientsList: clientsList
};
};export const initialState = {
users: userList.json,
activeUser: null
}
export default function userReducer = (state = initialState, action) {
const {type, payload} = action
switch (type) {
case SET_ACTIVE_USER:
return {...state, activeUser: payload}
default:
return state
}
}
Но при хорошей модульной структуре, не очень важно какими компонентами вы пользуетесь.
Если у вас классовый компонент на 1000 строк и функциональный на столько же строк, то проблема не в них, а у вас.
Все таки, если не получается, то используйте классы. Не вижу проблем.