How the wordpress login and signup in react native app
Can anyone help me to login and sign up in reactnative app
i have a Wordpress website and i want to link my wordpress site to reactnative app.
search lots of solution but no one help me. i am using jwt auth plugin but don't know how to integrate this in reactapp.?
import {
SafeAreaView,
StyleSheet,
ScrollView,
View,
Alert,
Text,
StatusBar,
Image,
TextInput,
TouchableOpacity,
ImageBackground,
ActivityIndicator,
FlatList,
Button,
Linking
} from 'react-native';
import AsyncStorage from '@react-native-community/async-storage';
import { createAppContainer } from 'react-navigation';
import { createStackNavigator} from 'react-navigation-stack';
import { YellowBox } from 'react-native';
YellowBox.ignoreWarnings(['Remote debugger']);
const userInfo = {username:'demo',password:'demo'};
class HomeScreen extends React.Component {
static navigationOptions = {
header: null
};
constructor( props ) {
super( props );
this.state = {
username:'',
password:''
}
}
_onPressButton() {
Alert.alert('Login','Social login');
}
_signin = async()= {
await AsyncStorage.setItem('logged', '1');
if( userInfo.username===this.state.username userInfo.password===this.state.password) {
this.props.navigation.navigate('Dashboard');
}
else {
alert('Username / Password Incorrect');
}
}
_retrieveData = async () = {
const logged = await AsyncStorage.getItem('logged');
this.props.navigation.navigate( logged !== '1' ? 'Auth' : 'App' );
}
render() {
const {navigate} = this.props.navigation;
return (
StatusBar backgroundColor="#22a86d" barStyle="light-content" /
ImageBackground source={require('./images/login_background.png')} style={styles.MainContainer}
View style={styles.body}
Image
style={{width:230, height: 80,marginBottom:30,resizeMode: 'contain'}}
source={require('./images/logo.png')}
/
TextInput
style={styles.input}
placeholder="User Name"
placeholderTextColor="#fff"
value={this.state.username}
onChangeText={(username)=this.setState({username})}
/
TextInput
style={styles.input}
placeholder="Password"
placeholderTextColor="#fff"
value={this.state.password}
onChangeText={(password)=this.setState({password})}
secureTextEntry={true}
/
Text style={styles.forgot}Forgot Password?/Text
TouchableOpacity style={styles.userBtn} activeOpacity={0.9}
onPress={this._signin}
Text style={styles.btnTxt}Login/Text
/TouchableOpacity
Text style={styles.account}Don't have an account?
Text style={styles.bold} onPress={() = navigate('Profile')} Create Account/Text
/Text
Text style={styles.signUp}Signup with/Text
View style={{flexDirection: 'row',marginTop:20}}
TouchableOpacity activeOpacity={0.9}
onPress={this._onPressButton}
Image
style={{width:70, height: 60, resizeMode: 'contain'}}
source={require('./images/fb.png')}
/
/TouchableOpacity
TouchableOpacity activeOpacity={0.9}
onPress={this._onPressButton}
Image
style={{width:70, height: 60,resizeMode: 'contain'}}
source={require('./images/twitter.png')}
/
/TouchableOpacity
TouchableOpacity activeOpacity={0.9}
onPress={this._onPressButton}
Image
style={{width:70, height: 60,resizeMode: 'contain'}}
source={require('./images/google.png')}
/
/TouchableOpacity
/View
/View
/ImageBackground
/
);
};
}
const MainNavigator = createStackNavigator({
Home: {screen: HomeScreen},
Profile: {screen: ProfileScreen},
Dashboard: {screen: DashboardScreen},
CampaignList: {screen: CampaignScreen},
DonorList: {screen:DonorScreen},
});
const App = createAppContainer(MainNavigator);
export default App;