Контекст в компоненте «без гражданства»?

Question

У меня есть следующий код в компоненте, и я хотел бы без гражданства компонент для доступа к этой части кода:

Основной компонент:

function createApp(store, communityIds) { 
const App = React.createClass({ 

    childContextTypes: { 
     localizedString: React.PropTypes.func, 
    }, 

    getChildContext: function() { 
     return { 
      localizedString: function(key, fallback) { 
       return getKey(key, fallback); 
      }, 
     }; 
    }, 

    render: function() { 
     return (
      <Provider store={store}> 
       <Client communityIds={communityIds}/> 
      </Provider> 
     ); 
    }, 
}); 

return <App/>; 
} 

Stateless:

export default() => (dispatch, getState) => { 
const state = getState(); 

const token = state.user.get('token'); 

if (!token) { 
    throw new Error('test'); // this.context.localizedString does not work 
} 
} 

бы признателен любой советы, привет!

Answer 1

То, что вы предоставили в соответствии с вашим определением функции «Без гражданства:», не является функцией без гражданства. Вы создали своего создателя действия как удар. Я предполагаю, что вы хотели вместо этого вставить код для своего клиентского компонента. Чтобы получить доступ к контексту в безгосударственном компоненте, компонент-клиент будет делать что-то вроде этого (который документированная here)

const Client = (props, context) => { 
    return <div >{context.localizedString("someKey", "someFallback")} </div> 
} 

Client.contextTypes = { 
    localizedString: React.PropTypes.func 
} 

export default Client 

Answer 2

Другого решения является функция самостоятельного ссылающаяся:

export default (Component=>(
    Component.contextTypes = { 
    localizedString: React.PropTypes.func 
    }) && Component 
)((props, context)=>{ 
    return <div>{context.localizedString("someKey", "someFallback")}</div> 
}) 

Или, если вы определяете contextTypes отдельно для его повторного использования, вы можете сделать:

//addContextTypes.js 
export default function(Component){ 
    return (Component.contextTypes = { 
    localizedString: React.PropTypes.func 
    }) && Component 
} 

//component.jsx 
import addContextTypes from './addContextTypes' 
export default addContextTypes((props, context)=>{ 
    return <div>{context.localizedString("someKey", "someFallback")}</div> 
})