useState is not working
can anyone tell me why in given below code is not working properly
let it return us "dark" but now i am trying to change dom by this value it is not working
in dom it is putting value of "translate-x-0" it should be "translate-x-[-93]"
28 Replies
whole component
Your setting localstoragetheme to a function
what that mean?
useState(()=>"hello") it will put usestate value to "hello" right?
Iirc, no
But test it and see
It might
it does
i know it
You have to use clsx or cn, to have conditional styles.
Ahh, so it does
oh why?
can't we do it will template string?
Because that's how it works
No
You don't
Yes you do
You're talking about the inline shorthand if in the string interp?
That will work perfectly fine
yeah
so where is problem?
${localStorageTheme === "dark" ? "translate-x-[-93%] " : "translate-x-0"}
This does not work with tailwind.It does because I do it in my projects lol
yeah
same
Also, to do negative translations with tailwind, use
-translate-x-[93%]
but that is not problem
it is giving me translate-x-0
isnt the problem in this
you set default value and then immediately remove that default value with theme
Ahh
yeah but for second it is showing change state i don't want that i am okay with light to light state change
Yeah yeah, good catch
i think i found out what is wrong with it
localstorage value is system
yeah this is problem ig
i should check if theme value is system then check what is real value
thank you your time guys i really appreciate it
btw josh you can see this if you already don't know about this https://tailwindcss.com/docs/content-configuration#class-detection-in-depth
Content Configuration - Tailwind CSS
Configuring the content sources for your project.
Generally, you shouldn't need to use useEffect. Its really only intended to sync data with an external source, or when you have stuff that needs cleaned up. In this case you should be able to do everything you need w/o it
i tried it but i failed
today i almost wasted whole day in this
const {theme ,setTheme}=useTheme();//which is from next theme
i don't know why when it is changing the theme value compoent is not rerendering and my button is in halt on dark mode until you click it
Well now your not updating localstoragetheme
Ahh your on click is changing based on it rather then your current theme state
i just correct it all those things
now everything works fine
i use contrl+shift+l change name for some reason what cause lot of problem