Skip to content

Instantly share code, notes, and snippets.

@Eyongkevin
Created July 2, 2020 19:32
Show Gist options
  • Save Eyongkevin/b117c43c39e5c66e567ebb9a4d7231f2 to your computer and use it in GitHub Desktop.
Save Eyongkevin/b117c43c39e5c66e567ebb9a4d7231f2 to your computer and use it in GitHub Desktop.
sample code for the tut `Build a Shopping Cart with React, Redux, and React-DnD`
class ShoppingCart extends Component{
render(){
const { canDrop, isOver, connectDropTarget } = this.props;
const isActive = canDrop && isOver;
let backgroundColor = '#FFFFFF';
if (isActive){
backgroundColor ='#F7F7BD';
} else if (canDrop){
backgroundColor = '#F7F7F7';
}
const style={
backgroundColor: backgroundColor
};
return connectDropTarget(
<div className="shopping-cart" style={ style } >
{
isActive
? 'Humm, phone!'
: 'Drag here to order!'
}
</div>
)
}
}
export default DropTarget(ItemTypes.PHONE, ShoppingCartSpec, collect)(ShoppingCart);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment