Skip to content

Instantly share code, notes, and snippets.

@Forest-Dewberry
Created July 5, 2023 19:49
Show Gist options
  • Save Forest-Dewberry/6e77e5ff1299cbf60c624a34f91779fc to your computer and use it in GitHub Desktop.
Save Forest-Dewberry/6e77e5ff1299cbf60c624a34f91779fc to your computer and use it in GitHub Desktop.
Udemy React Complete Guide 2023 Section 5 Assignment 2: Expenses Filter
import React from 'react';
import './ExpensesFilter.css';
const ExpensesFilter = (props) => {
const [selectedYear, setSelectedYear] = React.useState('2020');
const selectYearHandler = (e) => {
setSelectedYear(e.target.value);
props.onSelectYear(e.target.value);
}
return (
<div className='expenses-filter'>
<div className='expenses-filter__control'>
<label>Filter by year</label>
<select
name="selectedYear"
value={selectedYear}
onChange={e => setSelectedYear(e.target.value)}
>
<option value='2022'>2022</option>
<option value='2021'>2021</option>
<option value='2020'>2020</option>
<option value='2019'>2019</option>
</select>
</div>
</div>
);
};
export default ExpensesFilter;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment