score:1

Accepted answer

useselector takes a function of state as the argument. state being the state of the redux store. like this:

const numbers = useselector(state => somewhereinstate.number);

in this way, we can select variables out of the redux store. what you seem to be trying to do is update the selectednum variable. but i don't see where you're dispatching that update to the store. your useeffect doesn't fire because it depends on selectednum. your selectnumberhandler might alter selectednum, but your component doesn't know that, because selectednum is not a state variable in the component.

so you kind of need to decide: are you keeping the state local to the component, or are you communicating through the store?

local to the component - no useselector

const myfunction = () => {

  const [selectednumber, setselectednumber] = usestate(1)
  const [filterednumbers, setfilterednumbers] = usestate([])

  useefect( () => {
    setfilterednumbers(selectednumber)
  }, [selectednumber])

  return (
    <div>
      <select onchange={e => setselectednumber(e.value)}>
        <option value='1' >1</option>
        <option value='2' >2</option>
      </select>
      <div classname={'numbers-list'}>
        {filterednumbers.map(num => {
          <p>{num}</p>;
        })}
      </div>
    </div>
  );
};

through redux store, with usedispatch and useselector


const myfunction = () => {

  const numbers = useselector(state => state.yourvalues);
  const dispatch = usedispatch()


  return (
    <div>
      <select onchange={e => dispatch( setyourvalues(e.value) )}>
        <option value='1' >1</option>
        <option value='2' >2</option>
      </select>
      <div classname={'numbers-list'}>
        {numbers.map(num => {
          <p>{num}</p>;
        })}
      </div>
    </div>
  );
};

where setyourvalue is a function that creates an action to update the yourvalue in the redux store.

hopefully that gives you some direction.


Related Query

More Query from same tag