Передача состояние useState

Как мне вынести состояние useState из файла. Нужно экспортировать именно sliderCount для дальнейшей работы. Заранее спасибо.

Есть 2 файла. В первом файле создается функция с useState и при клике на кнопки изменяет его состояние. Во втором файле я хочу получать измененное состояние useState из первого файла и дальше работать с ним.

Делать условия и т.д, как например:

if(sliderCount == 1){
    console.log('Number 1')
}

if(sliderCount == 2){
    console.log('Number 2')
}

Первый файл:

import React, {useState} from "react";

function ContainerAtwSwap() {
    const [sliderCount, setSliderCount] = useState(0)
    return (
        <div className="container_button__swap-main">
            <div className="dropdown">
                <div className="dropdown-content">
                    <button className="button__swap-button" onClick={() => setSliderCount(1)}>№1</button>
                    <button className="button__swap-button" onClick={() => setSliderCount(2)}> №2</button>
                    <button className="button__swap-button" onClick={() => setSliderCount(3)}>№3</button>
                </div>
            </div>
        </div>
    )
}

export default ContainerAtwSwap

Второй файл:

import React from 'react';

function WorkingEnvironment() {
    ..Вот тут хотелось делать условия и т.д
    return (
        <div className='boxControl scroll' id='boxSliderOne'>
            <div className='container-slider'>
                {}
            </div>
        </div>
    );
}

export default WorkingEnvironment;

Ответы (1 шт):

Автор решения: Калдар Кайрат

Попробуй эти два компонента обернуть в один общий компонент. И в этом компоненте создай state свой и передавай им в виде пропсов

→ Ссылка