2016-06-07 2 views
0

Я новичок в Redux/React и у меня проблемы с работами с объектами состояния.Работа с объектами состояния в Redux (базовый)

Я инициализирован мое состояние, как в index.js ниже, но я получаю эту ошибку

Uncaught Invariant Violation: Objects are not valid as a React child (found: object with keys {text}). If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons. Check the render method of ShowTweetComponent.

index.js

const initialState = { 
    text: 'test successful' 
} 

let store = createStore( 
    twitterApp,  
    initialState,  
    applyMiddleware( 
    thunkMiddleware 
) 
) 

console.log('1 - index.js loaded') 

render( 
    <Provider store={store}> 
     <App /> 
    </Provider>, 
    document.getElementById('LoadApp') 
) 

Вот мое действие

function getTweetData(json) { 
    return { 
    type: REQUEST_TWEETS, 
    tweet: json.status_text, 
    receivedAt: Date.now().toString() 
    } 
} 

function fetchTweets() { 

    return dispatch => { 
    return fetch(`/api/twitter`) 
     .then(response => response.json()) 
     .then(json => dispatch(getTweetData(json))) 
    } 


} 

export function fetchTweetsIfNeeded() { 
    return (dispatch, getState) => { 
    return dispatch(fetchTweets()) 
    } 
} 

А вот моему редуктору

const displayData = (state = [], action) => { 

    switch (action.type) { 

    case REQUEST_TWEETS: 
     return [ 
     ...state, 
     { 
      text: action.tweet 
     } 
     ] 

    default: 
     return state 
    } 
} 

Если есть какая-либо дополнительная информация вам нужно, пожалуйста, дайте мне знать. Я могу только получить его на работу при работе с exampleState = 'this is my message!'

UPDATE: Вот репо (см папку клиента для реагировать вещи) https://github.com/jaegerbombb/twitter-api-test

+3

не имеет ничего общего с государством или Redux. Это ошибка React, скорее всего, в 'App'. Не могли бы вы показать нам это? – ZekeDroid

+2

В частности, 'ShowTweetComponent' кажется –

+0

Конечно, я добавил ссылку в описании. Дайте мне знать, если вы хотите получить дополнительную информацию. Я уже посмотрел, где ошибка ссылается, но не может понять проблему самостоятельно – darkace

ответ

1

Вы overwritting this.props.children с состоянием Redux (в вашем twitterContainer.js). Я не уверен, что это хорошая идея. React ожидают, что children будет node, но он получает массив (от вашего редуктора twitterApp).

Для вас кода, вы можете просто изменить children ключ к другому имени в twitterContainer.js и twitterComponent.js

Смежные вопросы