Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

picker onValuechange NOT WORKING IN REACT NATIVE

$
0
0

I am a bit new to react native and I am having difficulty getting selected values from my picker componentIs there any specific way to extract the selected picker item that works, I have tried all I can and I still get a wrong outputI keep getting wrong data passed out of the picker after following instructions in the URL belowhttps://reactnative.dev/docs/pickerThe values don't get passedsee my code below

import React, { FC, useEffect, useState } from "react"import {  View,  SafeAreaView,  TextInput,  ImageBackground,  ScrollView,  Alert,  Picker,  TouchableOpacity,} from "react-native"export const MyApp: FC<StackScreenProps<NavigatorParamList, "New">> = observer(({navigation}) => {  const getSuccessScreen = () => navigation.navigate("Successful")  const [productType, setProductType] = useState("")return (<ImageBackground source={Images.bg} style={FULL}><Loader loading={loading} /><ScrollView showsVerticalScrollIndicator={false} showsHorizontalScrollIndicator={false}><View style={BOTTOM_HALF}><SafeAreaView><Text style={SUBJECT}>Register A Device</Text><View style={THICK}><Text style={CENTER_TEXT}> CUSTOMER</Text><Picker                selectedValue={customerType}                style={PICKER_STYLE}                onValueChange={(text) => setCustomerType(text)}><Picker.Item value="None Selected" label="--Select Customer--" />                {customerArray.map((customer) => (<Picker.Item                    key={customer.customerNo}                    label={customer.customerName}                    value={customer.id}                  />                ))}</Picker></View><View style={THICK}><Text style={CENTER_TEXT}> PRODUCT</Text><Picker                selectedValue={productType}                style={PICKER_STYLE}                // eslint-disable-next-line no-lone-blocks                onValueChange={(itemValue, itemIndex) => {{                  if (itemValue) {                    console.info("<<< TEXT  PASSED >>>>>")                    setProductType( itemValue )                    getBatchByProductId(productType)                  } else console.info("<<< TEXT NOT PASSED >>>>>")                }}              }><Picker.Item value="None Selected" label="--Select A Product--" />                {productArray.map((product) => (<Picker.Item                    key={product.id}                    label={product.productServiceName}                    value={product.id}                  />                ))}</Picker></View><View style={THICK}><Text style={CENTER_TEXT}> BATCH</Text><Picker                selectedValue={batchType}                style={PICKER_STYLE}                onValueChange={(text) => setBatchType(text)}><Picker.Item value="None Selected" label="--Select A Batch--" />                {batchArray.map((batch) => (<Picker.Item key={batch.id} label={batch.batchNumber} value={batch.id} />                ))}</Picker></View><View style={RED_ACTION_STYLES}><View style={RED_ACTION_LINK}></View></View><View style={FOOTER_CONTENT}><Button                testID="next-screen-button"                style={CONTINUE}                textStyle={CONTINUE_TEXT}                tx="inside.register"                onPress={onRegisterDevice}              /></View></SafeAreaView></View></ScrollView></ImageBackground>  )})

Viewing all articles
Browse latest Browse all 6287

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>