TextInput 字段未在 Map 函数中显示值 react-native

Question

value is not displaying inside 'Textput field' while passing dynamic content inside value 'prop'

const [arrayList, setArraylist]= [
         {id:0, ExpectedQuantity:10, DeliveredQuantity:7},
         {id:1, ExpectedQuantity:19, DeliveredQuantity:9},
         {id:2, ExpectedQuantity:11, DeliveredQuantity:11},
         {id:3, ExpectedQuantity:45, DeliveredQuantity:30},
     ]

arrayList.map((items,index)=>{ 

     return
            <TextInput  value={items.DeliveredQuantity} />

})

Answer 1

Sample solution with react-material-ui Note: as per your above snippet,

useState is missing which can cause errors

 import React, { useState } from "react"; import TextField from "@material-ui/core/TextField"; import { makeStyles } from "@material-ui/core/styles"; const useStyles = makeStyles((theme) => ({ root: { "& .MuiTextField-root": { margin: theme.spacing(1), width: "25ch" } } })); export default function FormPropsTextFields() { const classes = useStyles(); const [arrayList, setArraylist] = useState([ { id: 0, ExpectedQuantity: 10, DeliveredQuantity: 7 }, { id: 1, ExpectedQuantity: 19, DeliveredQuantity: 9 }, { id: 2, ExpectedQuantity: 11, DeliveredQuantity: 11 }, { id: 3, ExpectedQuantity: 45, DeliveredQuantity: 30 } ]); return ( <form className={classes.root} noValidate autoComplete="off"> <div> {arrayList.map((items, index) => { return <TextField defaultValue={items.DeliveredQuantity} />; })} </div> </form> ); }