React.js Popup модал для корзины покупок - PullRequest
Новая
       19

React.js Popup модал для корзины покупок

0 голосов
/ 19 сентября 2019

В настоящее время я работаю над корзиной для покупок и пытаюсь выяснить, как должен выглядеть модал, когда я нажимаю на иконку корзины для покупок.Я посмотрел документацию для semantic-ui для модалов, но неясно, как заставить модал появляться при нажатии на что-то.Я использую semantic-ui class = "ui modal" для модального.

Я думал о том, чтобы поставить иконку onClick, но все еще не понимал, как идти дальше.В настоящее время у меня есть значок в другом компоненте и корзина для покупок в другом отдельном компоненте.Я хочу, чтобы элементы появлялись во всплывающем моде, который должен быть корзиной покупок.

import React from 'react'
import { Icon } from 'semantic-ui-react';

const ShoppingCartIcon = () => {



   return(

     <Icon.Group size='big' className="shopping_cart_icon">
       <Icon link name='shopping cart'/>
       <Icon corner='top right'/>
   </Icon.Group>
)


}
export default ShoppingCartIcon;


  import React from 'react'
  import Shirt from './Shirt';

   class ShoppingCart extends React.Component {

    render() {

   const listShirts = this.props.shirts.map(shirt => {
     return <Shirt key={shirt.id} {...shirt}/>
   })

   return(
     <div className="ui modal">
       <div className="content">
         {listShirts}
      </div>
     </div>
    )
   }

 }
 export default ShoppingCart;

В настоящее время у меня пока нет функции добавления товаров в корзину.Я просто хочу сосредоточиться на том, чтобы модал появлялся, когда я нажимал на иконку корзины для покупок

...