Category : react-hooks

I am trying to create a mobile styling for my project but whenever i switch from large screen (desktop screen) to mobile screen I have to refresh the page to make it change to mobile look. Here is my following code: const screenLayoutType = useScreenSize(); {screenLayoutType === "smallScreen" && ( <Layout serverUserData={serverUserData}> <div className={classes.mobilePageContainer}> <div ..

Read more

Im using a React´s hook to stablish a value according with wich button has been clicked, but the setBotonPresionado doesnt update the value, the console log shows that, the value is empty wich is the initial value const [desactivarComprar, setDesactivarComprar] = useState(true); const [desactivarPrimerBoton, setDesactivarPrimerBoton] = useState(false); const [desactivarSegundoBoton, setDesactivarSegundoBoton] = useState(false); const [desactivarTercerBoton, setDesactivarTercerBoton] ..

Read more

My Code: import React, { useState } from "react"; import Modal from "./Modal"; function showModal() { setShowModal(true); } export default function NewPost() { const [showModal, setShowModal] = useState(false); if (showModal) { return ( <h1> <Modal /> </h1> ); } return ( <div className="new-post"> <button onClick={showModal} type="button" className="new-post-form"> Was machst du gerade, Toni? </button> <div className="options"> ..

Read more

I would love to understand what needs to be fixed in useEffect to fix the error described. here is the "dataSource" : [{"isSelect":false, "selectedClass":null, "zoneId":1026, "zoneName":"tomato"}, {"isSelect":false, "selectedClass":null,"zoneId":1025, "zoneName":"apple"}] function Button1(props) { const [listSelectedZoneIds, setListSelectedZoneIds] = useState([]); useEffect(() => { let listSelectedZoneIds = dataSource .filter((zone) => zone.isSelect === true) .map((zone) => zone.zoneId); setListSelectedZoneIds(listSelectedZoneIds); }, [dataSource]); ..

Read more

{ roomDept.map((item, index) => ( <div key={index} className="flex flex-col pb-2 items-center"> <div className="flex pb-2 w-full"> <SelectPicker placeholder="Select Room" data={room[‘data’]} labelKey="name" valueKey="code" className="w-1/2" cleanable={false} disabledItemValues={roomDept.map(x => x.code)} onChange={(value) => { control.setValue(‘rooms’, _setRoomDept(value, index, ‘code’)); const _ID = room[‘data’].filter(room => room.code === value).map(x => x.id); (async function fetch() { let _department = await getAllDepartment({ room: _ID[0] }); ..

Read more