We Keep Coding

The text is not output to the form

I'm new to react native, trying to write a small project (notebook). I implemented the buttons, they all work, but when I save an entry to the form, nothing is displayed and does not give errors.
import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Modal, Text, View, ScrollView, TextInput, Image, Button } from 'react-native';
import { Ionicons } from '#expo/vector-icons';
import React, {useState} from 'react';
import { Formik } from 'formik';
export default function App() {
const [news, setnews] = useState([
{name: '', text: ''}
]);
const addArtical = (artical) => {
setnews((list) => {
artical.key = Math.random().toString();
return[
artical,
...list
]
});
setModalWindow(false);
}
const [modalWindow, setModalWindow] = useState(false);
return (
<View style={styles.container}>
<Text style={styles.title}>Main tasks:</Text>
<ScrollView horizontal={true} showsHorizontalScrollIndicator={false}>
<View style={styles.up}>
<View style={styles.cub}></View>
<View style={styles.cub}></View>
<View style={styles.cub}></View>
<View style={styles.cub}></View>
<View style={styles.cub}></View>
<View style={styles.cub}></View>
</View>
</ScrollView>
<ScrollView vertical={true} showsVerticalScrollIndicator={false}>
<View style={styles.all}>
<TextInput style={styles.d} placeholder=' Search'></TextInput>
<Text style={styles.titletwo}>Other tasks:</Text>
<Ionicons style={styles.ic} name="add" size={30} color="black" onPress={() => setModalWindow(true)}/>
</View>
<Modal visible={modalWindow}>
<Ionicons style={styles.ic} name="close" size={30} color="black" onPress={() => setModalWindow(false)}/>
<View>
<Formik initialValues={{name: '', text: ''}} onSubmit={(values, clean) => {
addArtical(values);
clean.resetForm();
}}>
{(props) => (
<View >
<TextInput value={props.values.name} placeholder='Name' onChangeText={props.handleChange('name')}/>
<TextInput value={props.values.text} multiline placeholder='Text' onChangeText={props.handleChange('text')}/>
<Button title='Add' onPress={props.handleSubmit}/>
</View>
)}
</Formik>
</View>
</Modal>
</ScrollView>
</View>
);
}
Read more: I click add entry, a field opens with the addition of text, fill in the field with the necessary information, save, everything is successful, but my entry is nowhere

React Native simple useState does not work, state is staying 'undefined' and "setState is not a function"

I have just a simple React-Native Component that uses useState as a test if it works. When I set the userstate, and I just print it, it logs 'undefined'. Also when I call setUser, it throws an error, that setUser is not a function. Whats wrong with my Setup?:
import { StyleSheet, Text, View, TextInput, Button, Seperator, Pressable } from 'react-native'
import React, {useState, useEffect} from 'react'
import colors from '../theme/colors.style.js'
import NetInfo from '#react-native-community/netinfo';
import { checkConnected } from '../utils/Netinfo.js';
export default function MachineManager() {
const {connectStatus, setConnectStatus} = useState(false);
const {user, setUser} = useState("martin");
console.log(user);
return (
<View style={styles.container}>
<View style={styles.connectorMenu}>
<View style={styles.shadowView}>
<View style= {styles.connectionMenuHeader}>
<Text style={styles.connectionMenuHeaderText}>Verbundenes Gerät</Text>
</View>
<View style={styles.inputRow}>
<Text style={styles.inputLabel}>SSID:</Text>
<TextInput placeholder="SSID Kennung" style={styles.input}/>
</View>
<View style={styles.inputRow}>
<Text style={styles.inputLabel}>Passwort:</Text>
<TextInput placeholder="Passwort" style={styles.input}/>
</View>
<View style={styles.connectionControl}>
<View style={styles.connectionControlStatus}>
<Text style={styles.connectionControlStatusText}>Status: Nicht Verbunden</Text>
<Text style={styles.connectionControlStatusText}>{user}</Text>
</View>
<View style={styles.connectionControlConnect}>
<Pressable style={styles.connectButton}>
<Text style={styles.connectButtonText}>Verbinden</Text>
</Pressable>
</View>
</View>
</View>
</View>
</View>
)
}

The syntax is incorrect. It needs to be -
const [connectStatus, setConnectStatus] = useState(false);
const [user, setUser] = useState("martin")

How to navigate from one screen to another in React native?

When I click on Sign Up button I want to navigate to Sign up page but it did not work. I have imported the screens and navigated screen also to app.js file. I am getting an ReferenceError : Can't find variable: navigation. Also I am unable to insert background image? Below is the Sign Up page.
import React from 'react';
import { StyleSheet,ImageBackground,Text, View, TextInput, TouchableOpacity } from 'react-native';
let bgImage='../../resources/images/bg2.png'
export default class LoginScreen extends React.Component {
state={
email:"",
password:"",
}
render(){
return (
<View style={styles.container}>
<Text style={styles.logo}>Trollo</Text>
<View style={styles.box}>
<View style={styles.inputView} >
<TextInput
style={styles.inputText}
placeholder="Email"
placeholderTextColor="#808080"
onChangeText={text => this.setState({email:text})}/>
</View>
<View style={styles.inputView} >
<TextInput
secureTextEntry
style={styles.inputText}
placeholder="Password"
placeholderTextColor="#808080"
onChangeText={text => this.setState({password:text})}/>
</View>
<TouchableOpacity style={styles.loginBtn}>
<Text style={styles.loginText}>SIGN IN</Text>
</TouchableOpacity>
<TouchableOpacity>
<Text style={styles.forgot}>Forgot Password?</Text>
</TouchableOpacity>
</View>
<Text style={styles.text1}>New Here?</Text>
<TouchableOpacity style={styles.signupBtn} onPress = {(navigation) => navigation.navigate('Sign Up')}>
<Text style={styles.loginText}>SIGN UP</Text>
</TouchableOpacity>
<Text style={styles.logoText}>Trollo</Text>
</View>
);
}
}
});

onPress handler does not getting called with navigation as the first parameter. That is undefined. navigation is a prop to your class component which is provided by stack navigator setup.
Instead of
onPress = {(navigation) => navigation.navigate('Sign Up')}
use
onPress = {() => this.props.navigation.navigate('Sign Up')}

React Native TouchableOpacity is auto clicked

I put console.log('Hello') to my button, to testing my button is work or not (actualy im using this button for navigation), but when i try to reload my app, my console show Hello. I didn't press my button yet, but when i try to press it my console didn't show hello.
Sorry for my bad english
import React from 'react';
import {View, TouchableOpacity, Image} from 'react-native';
import s from './SFooter';
import {useNavigation} from '#react-navigation/native';
const Footer = () => {
const navigation = useNavigation();
let active = 0;
return (
<View style={s.footerWrapper}>
<View style={s.iconsWrapper}>
<View style={s.iconWrapper}>
<TouchableOpacity
onPress={(console.log('asda'), () => navigation.navigate('Home'))}>
<Image
style={s.icon}
source={require('../../assets/icon/home.png')}
/>
{active == 0 ? <View style={s.iconActive} /> : <View />}
</TouchableOpacity>
</View>
<View style={s.iconWrapper}>
<TouchableOpacity>
<Image
style={s.icon}
source={require('../../assets/icon/book.png')}
/>
{active == 1 ? <View style={s.iconActive} /> : <View />}
</TouchableOpacity>
</View>
<View style={s.iconWrapper}>
<TouchableOpacity>
<Image
style={s.icon}
source={require('../../assets/icon/newspaper.png')}
/>
{active == 2 ? <View style={s.iconActive} /> : <View />}
</TouchableOpacity>
</View>
<View style={s.iconWrapper}>
<TouchableOpacity>
<Image
style={s.icon}
source={require('../../assets/icon/user.png')}
/>
{active == 3 ? <View style={s.iconActive} /> : <View />}
</TouchableOpacity>
</View>
</View>
</View>
);
};
export default Footer;

Please do check your code twice. You cannot call any function directly onPress. what i mean to say is following
Wrong:
<TouchableOpacity
onPress={(console.log('asda'), () => navigation.navigate('Home'))}
Correct
<TouchableOpacity
onPress={() => (console.log('asda'), () => navigation.navigate('Home'))}>

React-native deep linking not working on iOS

I'd like two buttons in my customerServices component to deep link to the phone's dial and the phone's email client. However the Linking.openURL not working on iOS, just on Android. What would you recommend? I have the following code:
import React, { Component } from 'react';
import { Text, View, TouchableOpacity, StyleSheet, Image, Linking } from 'react-native';
import Container from '../../components/Container';
import { Images, Colors, FontFamily } from '../../components/Theme';
import InnerContainer from '../../components/InnerContainer';
export default class CustomerService extends Component {
constructor(props) {
super(props);
this.state = {
}
}
render() {
return (
<Container style={styles.container} type="mancsTRBL">
<InnerContainer style={styles.innerContainer}>
<TouchableOpacity style={styles.sideCard} onPress={() => { Linking.openURL("tel://+36201234567") }}>
<View style={styles.row}>
<Image source={Images.call} style={styles.icon} />
<View>
<Text style={styles.serviceHeader}>Customer service</Text>
<Text style={styles.serviceText}>+36 20 123 4567</Text>
</View>
</View>
</TouchableOpacity>
<TouchableOpacity style={styles.sideCard} onPress={() => { Linking.openURL("mailto:email#email.com") }}>
<View style={styles.row}>
<Image source={Images.email} style={styles.icon} />
<View>
<Text style={styles.serviceHeader}>Email </Text>
<Text style={styles.serviceText}>email#email.cc</Text>
</View>
</View>
</TouchableOpacity>
</InnerContainer>
</Container>
);
}
}