Here is my Market file
import {useState} from 'react';
function Market(){
const [items, setItems] = useState([ {
items: "Apples"
},
{
items: "Oranges"
},
{
items: "Bananas"
}
]);
return (
Welcome to the Market!
Add and remove items from your list
{items.map((items, index) => (
{items.items}
)
)
}
)
}
export default Market;
Here is the AddItems file
import React from 'react';
import Market from '../Market';
class AddItems extends React.Component{
constructor(props){
super(props);
this.state = {
add: []
}
}
render(){
return (
{
new AddItems(event.target.value);
}
} />
{
const add = this.state.add;
add.push(<market count="{add.length" +="" 1="" }="">);
this.setState({add: add});
}
}> Add Items!
)
}
}
export default AddItems;
Here is the DeleteItems file
import React from 'react';
import Market from '../Market';
class DeleteItems extends React.Component{
constructor(props){
super(props);
this.state = {
remove: []
}
}
render(){
return (
{
const remove = this.state.remove;
remove.splice(<market count="{remove.length" -="" 1="" }="">);
this.setState({remove: remove});
}
}> Delete Items!
)
}
}
export default DeleteItems;
What I have tried:
I tried doing .push and .splice, but when I type in something to add, nothing happens after I hit the Add button and nothing happens after I hit the Delete button.