[Solved]-Add dynamic attribute in ReactJS-Reactjs

i think, there are two solutions possible:

1- use spread syntax ..., and pass put all the passed values on button, by this was you don't need define each property separately. like this:

return <button 
        key={index}
        classname={`btn btn-default ${element.class} ${element.secondary ? "btn-secondary" : ""}`}
        type="button"
        {...element}
    >
        {element.label}
</button>

now if you pass onclick then only it will be assigned otherwise not.

2- use destructuring and assign the default value if not passed from the parent.

like this:

{this.props.datasrc.map((element, index) => {
    const {onclick=null, datagrid=''} = element;
    return <button 
            key={index}
            classname={`btn btn-default ${element.class} ${element.secondary ? "btn-secondary" : ""}`}
            type="button"
            disabled={element.disabled}
            onclick={onclick}
            data-grid={datagrid}
        >
            {element.label}
    </button>
})} 

working example.