javascript - React passing state to sibling component -

const chatbox = ({ messages, sendinput }) => {     <card fluid classname={theme} raised style={{ height: '100%' }}>         <chatlog             messages={messages}         />           <recordinput // has internal recording state            sendinput={sendinput}          />     </card> } 

my chatbox contains chatlog , recordinput.

the chatlog contains list of messages displayed.

the recordinput user voice recording input sent chatlog. component has internal recording state can true or false.

i want send recording state chatlog sibling component.

one solution: can make chatbox class component recording state , pass both chatlog , recordinput .. rather not refactor functionless stateless component ..

is there way this? perhaps redux or doing sort of cloning?

there multiple options:

1. use redux have global state, mentioned.
2. add recordinput class onrecordstatuschange prop called within component every time status changed, , tell parent component (card) new status of recording. way can save status of recording both in parent , child component, , parent component can pass data other child components (siblings of recordinput component).
3. use ref on recordinput check status of recording of inside component (which don't think want in specific situation, can this).