problem description

is to use < Button > included with react material-ui to bind a click event to get < Button isT="true" > in which the custom attribute isT

the environmental background of the problems and what methods you have tried

is that this < Button > component contains both span and font bound with the click event, which will trigger them not to return the properties in the Button. The default event to prevent bubbling has been added, and the code can be seen.

related codes

/ / Please paste the code text below (do not replace the code with pictures)

import React from "react"
import Button from "@material-ui/core/Button"
class TestButtonEvent extends React.Component {
    constructor(props){
        super(props)
        this.state={

        }
    }
    handleClick(event){
        // event.stopPropagation();
        event.nativeEvent.stopImmediatePropagation();
        // event.preventDefalut()
        // alert(event.targrt.nodeName);
        console.log("0:"+event.target.nodeName)
        console.log("1:"+event.target.isTrue)
        console.log("2:"+event.target.getAttribute("isTrue"))
        }
    render(){
        
        return(
            <Button  size="large" isTrue="true" variant="contained" color="primary" onClick={this.handleClick.bind(this)}>123</Button>
            )
    }
}
export default TestButtonEvent

what result do you expect? What is the error message actually seen?

expect to return a value using event.target.isTrue

because span is the middle part of the button, clicking in the middle will return the property of span, but without my custom attribute, clicking undefine null, to the edge of button will trigger