menu

React

A community of developers, designers and others who love React.js. ⚛️

Channels
Chat
view-forward
# All channels
view-forward
# General
view-forward
# Help
view-forward
# Jobs
view-forward
Team
Posts
Chat
Members
Info
Show previous messages

December 29, 2020 at 5:26pm
ABOUT US
const Container = styled.div<InfoSectionProps>`
display: flex;
flex-direction: column;
letter-spacing: 2px;
line-height: 1.8em;
align-items: center;
padding:2rem;
${props => props.primary && css`
background: yellow /*doesnt work*/
`
background: ${props => props.primary ? "red" : "yellow"} /*gives both infoSection yellow background, so not recognising primary props*/
}
`
export default (props: InfoSectionProps) => {
console.log(props)
const { header, subheader, content, logo, footerLogo, cta, ctaText } = props
return (
<Container>
{
logo && <LogoImage src={logo} alt="logo" />
}
<Content >
<Header> {header}</Header>
<SubHeader>{subheader}</SubHeader>
{content!.map((paragraph: string, index: number) =>
<p key={index}>{paragraph}</p>
)}
{cta && <BookNowButton>{ctaText}</BookNowButton>}
</Content>
{
footerLogo && <BGroundImage src={footerLogo} alt="cat" />
}
</Container >
);
}
APP.JS
<InfoSection
primary
logo={Logo}
header={homeSection.header}
subheader={homeSection.subheader}
content={homeSection.content}
cta={homeSection.cta}
ctaText={homeSection.ctaText}
/>
<InfoSection
logo={Logo}
header={aboutUsSection.header}
subheader={aboutUsSection.subheader}
content={aboutUsSection.content}
footerLogo={Boss}
/>
export interface InfoSectionProps {
primary?: boolean,
logo?: any;
header?: string;
subheader?: string;
content?: string[];
footerLogo?: any;
cta?: boolean,
ctaText?: string
}
Edited
  • reply
  • like

December 30, 2020 at 9:15am
Hello
  • reply
  • like

January 6, 2021 at 4:04pm
Good day
  • reply
  • like
Pls I need help on react
  • reply
  • like
Am using external js, which was link to the app from the index.html file of the public folder.
  • reply
  • like
I noticed that when the page get tender for the first time the actions click works but when navigating to other pages,
  • reply
  • like
the action won't work until the page is refreshed
  • reply
  • like
Pls help me out on this
  • reply
  • like

January 7, 2021 at 7:35am
Hey, anyone who can help me by providing drag and drop form fields or related example code in functional components.
example:
  • reply
  • like

January 15, 2021 at 10:00pm
Hello dear, have a good time
How to make instagram clone and amazon clone and youtube clone and ... www.courses.bangimo.com
  • reply
  • like

February 1, 2021 at 11:09pm
good evening dear developers, I want to use react native contact to access my contacts but my application crashes on startup. when i remove i getContacts code the application chews. I need your help, I am working on a project and I have a deadline to meet
  • reply
  • like

February 2, 2021 at 12:30pm
Hi developers I m looking for a friend to work on react together. I mean just reactjs body :) We can determine a common tutorial then we can develop each other. If somenone says okay for this, get in touch me please
Edited
  • reply
  • like

February 7, 2021 at 2:45pm
good evening dear developers, I want to use react native contact to access my contacts but my application crashes on startup. when i remove i getContacts code the application chews. I need your help, I am working on a project and I have a deadline to meet
React native can be crazy sometimes, mine has refused to give me the latest snapshot of my state
  • reply
  • like
Hello, I am looking to get pointed in the right direction with a react router and react transition group issue.
I am creating a routed slide transition based on this project https://github.com/nicgirault/dynamic-transitions. I am able to get this partially working as the enter transition works, but the exit does not always work as the actual component gets unmounted before the exit transition.
In the uploaded gif we can see the first exit has content, but the second exit loses its content. I am using childFactory in the TransitionGroup which seems to be working as we see the divs properly get the right classes. I just can't figure out why the content unmounts before the transition.
Another note is that the exit works with the root path /, and is not working on any other ex. /routeName. I have looked into causes being css, properly setting keys, the routes themselves too no avail. Any help would be appreciated.
  • reply
  • like

February 10, 2021 at 10:05am
I am trying to display a component 3 time. I have an array of object but when I try to the slice method it shows an error "can not read property slice of undefined.
  • reply
  • like

February 15, 2021 at 10:05am
Hi , guys I am trying to visualise Arduino sensor data to my react app in real time any one have any idea how to do it ? On localhost only I don't wanna deploy it
  • reply
  • like

March 2, 2021 at 7:56am
Hello everyone, i want to display pop up videoplayer in React once i click on one of the embedded videos in my component
  • reply
  • like

March 5, 2021 at 7:09pm
Hi guys! Im trying to use a Loader component I created in a react app, I can use it in some of the pages and it works just fine, but In some pages it just not working, I guess Im failing in sending some props but im not understanding exactly what im doing wrong...
  • reply
  • like

March 7, 2021 at 11:32am
Can anyone help me for multi search in material ui react table ?
  • reply
  • like

March 10, 2021 at 9:08am
hello, does anyone develop a project about micro frontend ?
  • reply
  • like
Which component services do you use when developing microfrontend?
  • reply
  • like

March 11, 2021 at 12:56pm
Hi every one! I'm New in this group. I'd like to know some thinks about hooks. Does component Is mounted every time state variable change ? Thanks for help
  • reply
  • like

March 20, 2021 at 2:08pm