Как проверить e.target элемент на наличие onClick?

Question

[vaskadogana]

Ниже кусок кода, onСlick есть на div "one_of_list" и на button ''show_template"? хочу чтобы onClick по диву не срабатывал при клику по кнопке, в то же время по остальным дочерним элементам дива срабатывал. Думаю решить это через проверку элемента на наличие события по клику на него

<div 	key =		{this.props.index}
						className =	'one_of_list'
						data-id =	{this.props.id}
						style = 	{this.style(this.state.choosed, this.state.expand)}
						onClick = 	{this.clickByTempl}>
						<div className='head_templ'> 
							<p className = 'template_name'>
									{this.state.name}
							</p>	
							<button className = 'show_template'
									style = 	{this.visibility(this.state.choosed)}
									onClick = 	{()=>this.setState({
													expand: !this.state.expand
												})}>
									{template_arrow('arrow_template', this.state.expand)}
							</button>
						</div>	
						<div className = 'option_block'>
							<button className =	'secondary_btn_small'
									onClick =	{()=>{this.props.callGiveTask(this.props.id, this.props.index)}}>
									{language_variant.give_task}
							</button>

Answer 1

[0xD34F]

Не надо ничего проверять, просто отменяйте всплытие события в обработчике клика по кнопке.

Answer 2

[Антон Спирин]

Вызывайте e.stopPropagation по клику по кнопке:

handleButtonClick = e => {
  e.stopPropagation();
  // do something else
};

Это остановит всплытие события.

Answer 3

[Роман Александрович]

хочу чтобы onClick по диву не срабатывал при клику по кнопке, в то же время по остальным дочерним элементам дива срабатывал

А что вам мешает на диве не прописывать обработчик Onclick а у остальных элементах дива прописать.

Comments

[vaskadogana]

Роман Александрович по клику на блок одно событие (он становится активным), по кнопкам внутри дива другие события

[vaskadogana]

Роман Александрович p.s. UI мешает и лень на каждый элемент писать он клик, хочу решить это

if(!Onclick){
choose
}

[Роман Александрович]

vaskadogana, может тогда проверять имя класса? и если это имя дива тогда ок если не дива ничего не выполнять?

[vaskadogana]

Роман Александрович, ну это костыльно, посоветовали

handleButtonClick = e => {
  e.stopPropagation();
  // do something else
};