menu
announcement

Spectrum is now read-only. Learn more about the decision in our official announcement.

React

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

Channels
Team
Show previous messages

November 25, 2020 at 11:38pm
In the "page" component call forceUpdate()
Edited

December 14, 2020 at 4:07pm
Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: null.
Check the render method of App.
Please help getting this error on my react-native app
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { MapView, Permissions, Location } from 'expo';
export default class App extends React.Component {
constructor(props) {
super(props);
this.state = {
region: null,
}
this._getLocationAsync();
}
_getLocationAsync = async () => {
let { status } = await Permissions.askAsync(Permissions.LOCATION);
if(status !== 'granted')
console.log('Permission to access location was denied');
let location = await Location.getCurrentPositionAsync({
enabledHighAccuracy: true
})
let region = {
latitude: location.coords.latitude,
longitude: location.coords.longitude,
latitudeDelta: 0.045,
longitudeDelta: 0.045,
}
this.setState({region: region})
}
render() {
return (
<View style={styles.container}>
<Text>Home</Text>
<MapView
initialRegion={this.state.region}
showsUserLocation={true}
showsCompass={true}
rotateEnabled={false}
style={{flex:1}}
/>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
},
});
🥺🥺🥺😔😔
HELP

December 18, 2020 at 8:35pm
I want to use prepack instead of webpack when react bundle. How can I do this?

December 28, 2020 at 7:25pm
Hi guys, I want to use Sanity with react. I signed in npm i -g /cli ... got version 2.1.0 BUT SANITY INIT sais -bash: sanity: command not found... why?

December 29, 2020 at 5:26pm
Help pleaseeee!! Newbie here with react & typescript & styled components
I have the a component -say AboutUs- that I want to reuse and style differently, for example giving it a background color of yellow if primary props are true or red if primary props is false.
When I console.log in ABOUT US shows that the first infoSection has primary props, and the second does not.
I have been trying to style those two infoSections differently the component does not seem to take "primary" into consideration despite being passed as props & showing on the console, so I don’t know what I am doing wrong & don’t seem to be able to find the solution googling it…?
Any help/hint would be much appreciated!
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

December 30, 2020 at 9:15am

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

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:

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

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

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

February 7, 2021 at 2:45pm
React native can be crazy sometimes, mine has refused to give me the latest snapshot of my state
Show more messages