Pelo que entendi componente não é atualizado - resolvido

Front-end
#1

PregaoIniciarjsx

import {
    AppBar,
    FormControl,
    InputLabel,
    makeStyles,
    MenuItem,
    Select
} from '@material-ui/core';
import React, { useState, Component } from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { todosAtivosPorEmpresa } from './PregaoIniciarAcoes';
class PregaoIniciar extends Component {

    componentWillMount() {
        this.props.todosAtivosPorEmpresa()
    }

    preenchimentoLicitacao = () => {
        const licitacoes = this.props.todosAtivosPorEmpresa() || [];
        return licitacoes.map(licitacao => (
            <MenuItem value={licitacao.id}>{licitacao.numeroAno}</MenuItem>
        ))
    }
    render(){
        return (
            <FormControl variant="outlined">
                <InputLabel id="demo-simple-select-outlined-label">Licitação</InputLabel>
                <Select
                    label="Licitação"
                >
                    <MenuItem value=""><em>Nenhum</em></MenuItem>
                    { this.preenchimentoLicitacao() }
                </Select>
            </FormControl>
        )
    }
}
const mapStateToProps = state => ({listaLicitacao: state.pregaoInicial.licitacoes})
const mapDispatchToProps = dispatch => 
    bindActionCreators({todosAtivosPorEmpresa}, dispatch)
export default connect(mapStateToProps, mapDispatchToProps)(PregaoIniciar)

PregaoIniciarAcoes.jsx

import axios from 'axios'

const URL = `http://localhost:8080/pregao-presencial-api/licitacao/`

export const todosAtivosPorEmpresa = () => {
    return (dispatch) => {
        const request = axios.get(`${URL}todosAtivosPorEmpresa/1`)
            .then(resp => {
                    dispatch({type: 'TODAS_LICITACOES_ATIVOS_POR_EMPRESA', payload: resp.data})
                }
            )
    }
}

PregaoInicialReducer

const INITIAL_STATE = { }

export default (state = INITIAL_STATE, action) => {
    switch(action.type) {
        case 'TODAS_LICITACOES_ATIVOS_POR_EMPRESA':
            return { ...state, licitacao: action.payload }
        default:
            return state
    }
}

reducers.jsx

import { combineReducers } from ‘redux’;
import PregaoInicialReducer from ‘…/views/pregaoIniciar/PregaoInicialReducer’;
import PregaoItemReducer from ‘…/views/pregaoItemPesquisar/PregaoItemReducer’;
const rootReducer = combineReducers ({
pregao: PregaoItemReducer,
pregaoInicial: PregaoInicialReducer
})
export default rootReducer;

index.jsx

import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { applyMiddleware, createStore } from 'redux';
import multi from 'redux-multi';
import promise from 'redux-promise';
import thunk from 'redux-thunk';
import App from './main/App'
import reducers from './main/reducers';
import * as serviceWorker from './serviceWorker';
const devTools = window.__REDUX_DEVTOOLS_EXTENSION__ 
    && window.__REDUX_DEVTOOLS_EXTENSION__()
const store = applyMiddleware(thunk, multi, promise)(createStore)(reducers, devTools)
ReactDOM.render(
    <Provider store={store}>
        <App />
    </Provider>
    , document.getElementById('root')
);
serviceWorker.unregister();

O Componente PregaoIniciar, é um modal, ao abrir ele vai no banco de dados buscar as licitações e montar no componente select

Ele vai ao banco de dados, busca os registros, status 200, mas não muda o componente, entendo que o componente é criado antes do sistema ir ao banco.

O que pode ser ?

#2

isso daqui esta errado. voce tem que pegar a lista que esta no seu estado. essa action ai so carrega a lista no estado global, ela nao retorna a lista para voce. precisa usar this.props.listaLicitacao que voce ja mapeou do redux.

preenchimentoLicitacao = () => {
    return this.props.listaLicitacoes.map(licitacao => 
        (<MenuItem value={licitacao.id}>{licitacao.numeroAno}</MenuItem>)
    )
}
#3

Deu este erro

class PregaoIniciar extends Component {
    componentWillMount() {
        this.props.todosAtivosPorEmpresa()
    }
    preenchimentoLicitacao = () => {
        const licitacoes = this.props.listaLicitacao || [];
        return this.props.listaLicitacao.map(licitacao => (
            <MenuItem value={licitacao.id}>{licitacao.numeroAno}</MenuItem>
        ))
    }
    render(){
        return (
            <FormControl variant="outlined">
                <InputLabel id="demo-simple-select-outlined-label">Licitação</InputLabel>
                <Select
                    label="Licitação"
                >
                    <MenuItem value=""><em>Nenhum</em></MenuItem>
                    { this.preenchimentoLicitacao() }
                </Select>
            </FormControl>
        )
    }
}
const mapStateToProps = state => ({listaLicitacao: state.pregaoInicial.licitacoes})
const mapDispatchToProps = dispatch => 
    bindActionCreators({todosAtivosPorEmpresa}, dispatch)
export default connect(mapStateToProps, mapDispatchToProps)(PregaoIniciar)

erro
erro.png1315×722 33.4 KB

#4

voce tem que arrumar o reducer tambem.

const INITIAL_STATE = { licitacoes: [] }

export default (state = INITIAL_STATE, action) => {
    switch(action.type) {
        case 'TODAS_LICITACOES_ATIVOS_POR_EMPRESA':
            return { ...state, licitacoes: action.payload }
        default:
            return state
    }
}
#5

Também continua com erro

const INITIAL_STATE = { }

export default (state = INITIAL_STATE, action) => {
    switch(action.type) {
        case 'TODAS_LICITACOES_ATIVOS_POR_EMPRESA':
            return { ...state, licitacoes: action.payload }
        default:
            return state
    }
}

erro
erro.png1915×904 45.4 KB

Continua com erro

#6

Ele vai aqui primeiro.

erro
erro.png1478×907 71.9 KB

Ainda não foi no servidor. Só vai no servidor, quando prossigo o breakpoint

#7

Funcionou, quando mudei para:

preenchimentoLicitacao = () => {
        const licitacoes = this.props.listaLicitacao || [];
        return licitacoes.map(licitacao => (
            <MenuItem value={licitacao.id}>{licitacao.numeroAno}</MenuItem>
        ))
    }

Obrigado @thimor