How to pass useState value to another component compare

Question

Im trying to achive background blur effect when another component appears.

I have Language Slider component and its Renders onClick={openLang} mentioned below.

const [lang, setLang] = useState(1)

const openLang = (index) => {
  setLang((index => index + 1))
}

so I trying to do next:

{lang / 2 === 1 ? styles={{filter: 'blur(10px)' : styles={{backgroun: '#F4F4F4'}}

I cant figure how to get lang value to another component where neither compnent is not child or parent.

Answer 1

You can use useContext to implement your idea. Here's the live demo for useContext

https://codesandbox.io/s/hardcore-borg-eox8qp?file=/src/App.js