Реагировать - не удалось добавить элемент в список в Redux - PullRequest
0 голосов
/ 11 сентября 2018

Сценарий: 1. Нажмите кнопку (Компонент класса A), чтобы добавить элемент в список (Компонент класса B).

InitialState для списка и console.log ('действие поиска найдено ') в редукторах работает отлично.

Но не удалось добавить еще один элемент в список.

Я проверил магазин после того, как вызвал действие "CLICK_SEARCH".Номер элемента в списке (products1), оставшийся только на 1 элементе (initialState, тот один).Кто-нибудь может помочь?

initialState3

 var initialState3 = {
        products1:[{
             id: "123",
              abbreviation: "123",
              case_no: "123",
              created_dt: "31/01/2018",
              last_updated: "11:43:45"

          }]
        }

редукторы

function ReducersForSeach(state = initialState3, action) {
      switch(action.type) {
          case 'CLICK_SEARCH': {

          console.log("search action found");
            return {
                      ...state,
                      products1: [...state.products1,
                       { 
                        id: "456",
                        abbreviation: "456",
                        case_no: "456",
                        created_dt: "31/01/2018",
                        last_updated: "11:43:45"
                       }
                      ]
                     }

          }
          default :{
              return state
          }
      }
    }

Компонент

  var Table  = React.createClass({

      render() {
          const { products1 } = this.props;    
          const tableHeaderColumns = columnData.map((column) => (
                    <TableHeaderColumn 
                    dataField={column.action}
                    isKey={column.isKey}
                    dataSort={column.dataSort}
                    >
                      {column.description} 
                    </TableHeaderColumn>   
                  ))


        return ( 
          <BootstrapTable  height='600'  style={{overflowY:"scroll"}} data={ products1 } options={ options } >
          {tableHeaderColumns}
          </BootstrapTable>
        );
      }
    })

Соединение

 function mapStateToPropsFortable(state) {  
        return {  
            products1: state.reducreForSeach.products1
        }  
    }  

    const Table1 = connect(mapStateToPropsFortable,null)(Table);


ReactDOM.render(
        <Provider store={store}>
          <Table1/>  
          </Provider>,

        document.getElementById('divReqListTable')
        );

Магазин

var rootReducer = Redux.combineReducers({
    reducreForAge,
    reducreForButtonGroup2,
    reducreForSeach
});

var store = Redux.createStore(rootReducer)

1 Ответ

0 голосов
/ 11 сентября 2018

В редукторе вместо изменения состояния попробуйте это.

function ReducersForSeach(state = initialState3, action) {
  switch(action.type) {
      case 'CLICK_SEARCH': {

      console.log("search action found");
      let {products1} = state;
      products1.push(  { 
                    id: "456",
                    abbreviation: "456",
                    case_no: "456",
                    created_dt: "31/01/2018",
                    last_updated: "11:43:45"
                   })
        return {
                 ...state, products1
                 }

      }
      default :{
          return state
      }
  }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...