DEV Community

karthikeyan
karthikeyan

Posted on

1

Find odd or even number by getting user input using redux

Hi folks today i come up with very popular concet called redux.

Here is the official Documentation for redux --> https://react-redux.js.org/tutorials/quick-start

Here i will show you how to find odd or even number using redux concept

Actually redux is using for very large applications so here i just want to show you in simple way how redux actually works

Here i am using subscribe for enable and disabling the button

function OddorEven() {
    const initialState = { value: 0 , isSubscribed : true }
    const Reduceraction = (state = initialState,action) => {
        if(action.type === 'checkOddorEven')
            {
                if(action.value % 2 === 0)
                {
                    window.alert('even number')
                } else {
                    window.alert('odd number')
                }
            }

        if(action.type === 'subscribe')
        {
            return {
                ...state,
                isSubscribed : !state.isSubscribed
            } 
        } 
        return initialState
    }

    let store = createStore(Reduceraction);

    return (
        <div>
            <Provider store={store}>
            <CheckOddorEven />
            </Provider>
        </div>
    )
}

export default OddorEven

Enter fullscreen mode Exit fullscreen mode

  function CheckOddorEven () {
       const select = useSelector(state => state)    
        console.log('select', select)
        const dispatch = useDispatch()
        const [state, setstate] = useState();
        return (
            <div>
         <input onChange={(e)=>setstate(e.target.value)} />
         <button 
           disabled={select.isSubscribed} 
           onClick={()=> dispatch(checkOddorEven(state))} >
             check
             </button>
         <button 
             onClick={()=>dispatch(subscribe())}> 
                subscribe 
           </button>
            </div>
        )
    }

    export default CheckOddorEven 
Enter fullscreen mode Exit fullscreen mode

SurveyJS custom survey software

Simplify data collection in your JS app with a fully integrated form management platform. Includes support for custom question types, skip logic, integrated CCS editor, PDF export, real-time analytics & more. Integrates with any backend system, giving you full control over your data and no user limits.

Learn more

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more