Answered step by step
Verified Expert Solution
Question
1 Approved Answer
import React, { useState } from 'react'; import { View, Text, StyleSheet, Button } from 'react - native'; import { Picker } from ' @react
import React, useState from 'react';
import View, Text, StyleSheet, Button from 'reactnative';
import Picker from @reactnativepickerpicker;
export default function Category
const selectedFruit setSelectedFruit useStateselect;
const selectedQuantity setSelectedQuantity useState;
const totalPrice setTotalPrice useState;
const fruitPrices
apple:
banana:
orange:
grapes:
mango:
;
const vegetablePrices
potato:
carrot:
tomato:
cucumber:
spinach:
;
const addToBasket
const price fruitPricesselectedFruit vegetablePricesselectedFruit;
const subtotal price parseIntselectedQuantity;
const newTotalPrice totalPrice subtotal;
setTotalPricenewTotalPrice;
console.logAdding $selectedQuantity $selectedFruits to the basket. Total cost: $$newTotalPrice;
;
return
Fruits
setSelectedFruititemValue
stylestylespicker
Vegetables
setSelectedFruititemValue
stylestylespicker
Quantity
setSelectedQuantityitemValue
stylestylespicker
Arraykeysmapi
Total Price: $totalPricetoFixed
;
const styles StyleSheet.create
container:
alignItems: 'center',
justifyContent: 'center',
padding:
backgroundColor: #ecff
borderColor: #ecff
title:
fontSize:
fontWeight: 'bold',
textAlign: 'center',
paddingVertical:
picker:
width:
height:
borderColor: #ccc
borderWidth:
marginVertical:
totalPrice:
fontSize:
fontWeight: 'bold',
textAlign: 'center',
paddingVertical:
;
This code is perfect on snack expo but I need the vegetable dropdown to be first instead of the fruits dropdown.
Step by Step Solution
There are 3 Steps involved in it
Step: 1
Get Instant Access to Expert-Tailored Solutions
See step-by-step solutions with expert insights and AI powered tools for academic success
Step: 2
Step: 3
Ace Your Homework with AI
Get the answers you need in no time with our AI-driven, step-by-step assistance
Get Started