spread style in react with css styles

Question

I am looking for a way to override styles of a component using css className, this is what i've tried so far:

<div
      style={{
        shadowColor: 'black',
        shadowOffset: { width: 0, height: 2 },
        shadowRadius: 6,
        shadowOpacity: 0.26,
        elevation: 8,
        boxShadow: '2px 5px 5px',
        border-color: 'white';

        ...props.style,
      }}>
      {props.children}
    </div>

and this is the css styles:

.component_override {
    height: 600px;
    width: 400px;
    background-color: rgb(255, 255, 255);
    border-radius: 30px;
    border: solid;
    border-color: #000000;
}

Answer 1

border-color: 'white';

should be

borderColor: 'white',