(react,antd,card) How can I block the onclick function from action buttons with antd card component?

I have a problem with clicking antd card.

Antd card layout This is my antd card layout. I consoled log with Card component by onclick method.

But when I clicked 1,2,3,4 area(antd card layout link), all of them console the "clicked card" message. I think this is right action because they are in Card component, but I want to block the onclick actions with the below action buttons. Finally it should console only when I clicked 1,2 area.

Below is my card component code.

<div> 
    <Card
        onClick={()=>console.log("clicked card")}
        hoverable
        cover={
            bucket.imgSrc === "" ? 
            <img 
                alt="random img"
                src="https://source.unsplash.com/random"
            />
            :
            <img
                alt="bucket img"
                src={bucket.imgSrc}
            />
        }
        actions={[
            <SearchOutlined key="edit" onClick={this.popupModal}/>,
            this.state.like ? 
                <Button icon={<HeartFilled />} type='link' key='like' onClick={this.handleDislike}> {this.state.likeCount}</Button>
                :
                <Button icon={<HeartOutlined />} type='link' key='dislike' onClick={this.handleLike}> {this.state.likeCount}</Button>
        ]}
        >

        <Card.Meta
            avatar={<UserAvatar photoURL={bucket.userPhotoURL} />}
            title={bucket.title}
            description={bucket.description}
        />
    </Card>
</div>