我正在使用NextJS，当我想从<Form.Control/>中获取值时，我陷入了困境，我在控制台中未定义并得到此错误

ReferenceError: value is not defined

这是错误

的屏幕截图
这是我的代码

import Card from 'react-bootstrap/Card';
import Col from 'react-bootstrap/Col';
import Row from 'react-bootstrap/Row';
import Button from 'react-bootstrap/Button';
import Hotel from '../../src/api/booking/booking';
// import {GetFacilitiesHotel} from '../../src/api/booking/booking';
import { useEffect, useState } from 'react';
import Container from 'react-bootstrap/Container';
import ListGroup from 'react-bootstrap/ListGroup';
import Form from 'react-bootstrap/Form';
import Link from 'next/link';
import HotelDetails from './details/[id]';
import { useRouter } from 'next/router'

function Booking() {
  const [hotel, setHotel] = useState<any[]>([])
  const [facility, setFacility] = useState<any[]>([])
  const [review, setReviews] = useState<any[]>([])
  const [refresh, setRefresh] = useState<any>(false)
  const [id, setId] = useState()
  const router = useRouter()
  const [values, setValues] = useState({});

  ...

  // console.log(facility)
  const changeHandler = (e, updatedAt) => {
    const minPrice = e.target.minPrice;
    const maxPrice = e.target.maxPrice;
    setValues({ ...values, [minPrice]: value });
    console.log(minPrice, value);
    // console.log(minPrice);
  };
    
  const submitHandler: FormEventHandler = (event) => {
    event.preventDefault();
    event.persist();
    console.log('push data somewhere :)')
    console.log(values);
  };
    
  return (
    <Container>
      <Row>
        <Col xs lg="2" className='mt-5'>
          <Card>
            <Card.Header>Filter</Card.Header>
            <Form onSubmit={submitHandler}>
              <Form.Group className="mb-3 mt-2" controlId="minPrice">
                <Col className='mx-2'>
                  <Form.Label>Minimum Price</Form.Label>
                  <Form.Control type="text" placeholder="Minimum" name='minPrice' onChange={changeHandler}/>
                </Col>
              </Form.Group>
              <hr></hr>
              <Form.Group className="mb-3 mt-0" controlId="maxPrice">
                <Col className='mx-2'>
                  <Form.Label>Maximum Price</Form.Label>
                  <Form.Control type="text" placeholder="Maximum" name='maxPrice' onChange={changeHandler}/>
                </Col>
              </Form.Group>
              <hr></hr>
              <Col className='mx-2'>
                <p className='mx-1 mb-2' muted>
                  Hotel Facilities
                </p>
                <Form.Group className="mb-3" controlId="parkingCheckbox">
                  <Form.Check type="checkbox" label="Parking Facility" />
                </Form.Group>
                <Form.Group className="mb-3" controlId="securityCheckbox">
                  <Form.Check type="checkbox" label="Security" />
                </Form.Group>
                <Form.Group className="mb-3" controlId="restaurantCheckbox">
                  <Form.Check type="checkbox" label="Restaurant" />
                </Form.Group>
                <Form.Group className="mb-3" controlId="laundryCheckbox">
                  <Form.Check type="checkbox" label="Laundry" />
                </Form.Group>
              </Col>
              <hr></hr>
              <Button variant="primary" type="submit" className='mb-2 ml-2'>
                Apply
              </Button>
            </Form>
          </Card>
        </Col>
        <Col>   
          <Row xs={1} md={2} className="my-5 mx-2">
            {Array.from(hotel).map((_, hotelItem) => (
              <Col key={hotelItem}>
                <Card className='mb-4'>
                  <Card.Img className='mt-2' style={{ maxWidth: 400, maxHeight: 400, margin: 'auto' }} variant="top" src="https://www.wartadepok.com/wp-content/uploads/2021/01/E3D1FA7E-88CB-484A-8811-B8E2900257E4.jpeg" />
                  <Card.Body>
                    <Card.Title>{hotel[hotelItem]['hotelName']} ({hotel[hotelItem]['hotelRatingStar']}&#9733;)</Card.Title>
                    <Card.Text>
                      {hotel[hotelItem]['hotelAddr']['addrLine1']}
                    </Card.Text>
                    <Card.Text>
                      {hotel[hotelItem]['hotelDescription']}
                    </Card.Text>
                    <Card.Text>
                      Facilities : {Array.from(facility).map((_, faciItem) => (
                        ((facility[faciItem]['faciHotel']['hotelId'])==(hotel[hotelItem]['hotelId']) ? facility[faciItem]['faciName'] : '')
                      ))}
                    </Card.Text>
                    <Card.Text>
                      <p>Guest Ratings: {reviewList(hotel[hotelItem]['hotelId'])}</p>
                    </Card.Text>
                    <Card.Text>
                      Contact : {hotel[hotelItem]['hotelPhonenumber']}
                    </Card.Text>
                    <Card.Text>
                      Price: {priceList(hotel[hotelItem]['hotelId'])}
                    </Card.Text>
                    {/* <Button onClick={()=>viewDetails(hotel[hotelItem]['hotelId'])} variant="info">View Details</Button>
                    {' '} */}
                    <Button href={`/booking/details/${hotel[hotelItem]['hotelId']}`} variant='info'>Details</Button>
                    {' '}
                    <Button variant="primary">Book Now</Button>{' '}
                  </Card.Body>
                </Card>
              </Col>
            ))}
          </Row>
        </Col>
      </Row>
    </Container>
  );
}

export default Booking;

我想当我点击提交按钮数据将发送到changeHandler函数，但我只得到未定义的结果。