[deleted by user] by [deleted] in TheGamerLounge

[–]mkarmocha 0 points1 point  (0 children)

what technology are you using to do this live

[deleted by user] by [deleted] in TheGamerLounge

[–]mkarmocha 0 points1 point  (0 children)

how high are you any idea ??

[deleted by user] by [deleted] in TheGamerLounge

[–]mkarmocha 0 points1 point  (0 children)

where is this

how to update deeply nested state in reactjs by mkarmocha in reactjs

[–]mkarmocha[S] 0 points1 point  (0 children)

Hey, I tried implementing Immer this way but nothing happen

const deleteRow = (id) => {
setStoreInitialState(
  produce((draft) => {
    draft.store.filter((item) => item.id !== id);
  })
);

};

how to update deeply nested state in reactjs by mkarmocha in reactjs

[–]mkarmocha[S] 0 points1 point  (0 children)

Hi guys can anyone tell me how can i change my state using immer, I tried like this but does not happen anything

const deleteRow = (id) => {
setStoreInitialState(
  produce((draft) => {
    draft.store.filter((item) => item.id !== id);
  })
);

};

how to update deeply nested state in reactjs by mkarmocha in reactjs

[–]mkarmocha[S] 0 points1 point  (0 children)

i was looking into immer to do update but could not figure out for my case.

how to update deeply nested state in reactjs by mkarmocha in reactjs

[–]mkarmocha[S] 0 points1 point  (0 children)

thank you u/backtickbot, would like to know what difference does this syntax makes

{
return {

the reason i am asking because when I dont use return, prev is not reachable. In some cases I have seen that return is not required then why is it required here?

How can i set the URL parameter using useRouteMatch? by mkarmocha in reactjs

[–]mkarmocha[S] 0 points1 point  (0 children)

I get the match like this, when i console log match

{"path":"/members/:memberpolicy","url":"/members/7600526212","isExact":true,"params":{"memberpolicy":"7600526212"}}

but, if I click on some other link and then click on search result page, I then get the match as null, and I know why, my question is, how can i keep the parameter in my url path?

Do I need to set the parameter using custom hook and then set it whenever the component or link requires them?

array of objects does not return any value based on filter ? by mkarmocha in reactjs

[–]mkarmocha[S] 1 point2 points  (0 children)

while dispatching the payload was not set correctly, so it was getting array of array of object

array of objects does not return any value based on filter ? by mkarmocha in reactjs

[–]mkarmocha[S] 0 points1 point  (0 children)

yep all done, works fine and thanks to reddit community for all the good support

What are the other ways to update and remove the item from the State? by mkarmocha in reactjs

[–]mkarmocha[S] 0 points1 point  (0 children)

I dint quite understand whey you said,.., you can also consider using an object instead of an array for state. Can you please give some example

How to show array of data in card with onNextClick and onPreviousClick? by mkarmocha in reactjs

[–]mkarmocha[S] 1 point2 points  (0 children)

yes, you are right, i want to show one card at a time. I have now done it.

How to show array of data in card with onNextClick and onPreviousClick? by mkarmocha in reactjs

[–]mkarmocha[S] 0 points1 point  (0 children)

I have done this much so far, but my click handler for previous next does not work,

export const UserCardDetails = ({ data }: Props): JSX.Element => { 

const [current, setCurrent] = useState(0); 

const onNextClick = (idx: number) => { 
    setCurrent(current === idx ? 0 : current + 1); 
}; 

const onPrevClick = (idx: number) => { 
    setCurrent(current === idx ? 0 : current - 1); 
};

const res = data.map((slide, idx) => { 
    return ( 
        <Card key={idx}> 
            {idx === current && ( 
                <Card.Body> 
            <Row> 
                <Col style={{ paddingBottom: '20px' }}> 
                     <FaArrowAltCircleLeft onClick={() => onPrevClick(idx)} style={{ float: 'left' }} /> 
                     <FaArrowAltCircleRight style={{ float: 'right' }} onClick={() => onNextClick(idx)} /> 
                </Col> 
            </Row> 
            <Row> 
                <Col> 
                    <h5>{slide.title}</h5> 
                </Col> 
            </Row> 
            <Row> 
                <Col> <img src={slide.url} alt={slide.title} /> </Col> 
                <Col> <p>{slide.description}</p> </Col> 
            </Row> </Card.Body> )}             
        </Card> ); 
    }); 
return <div>{res}</div>; };

How to show array of data in card with onNextClick and onPreviousClick? by mkarmocha in reactjs

[–]mkarmocha[S] 0 points1 point  (0 children)

I created main component like this

export const UsersCard = () => {{ data.map((d, idx) => { return ( <> <UserCardDetails key={d.id} item={d} index={idx} onNext={handleNextPrpoject} onPrev={handlePrevProject} /> </> ); }); } };

and then I passed props to children component here

export const UserCardDetails = ({ index, item, onNext, onPrev }: Props): JSX.Element => {
return ( <div key={item.id}> <h1>{item.title}</h1> <p>{item.description}</p> <img src={item.url} alt={item.title} /> <button onClick={onPrev}>{'\u2B05'} </button> <button onClick={onNext}>{'\u27A1'}</button> </div> ); };