How to correctly export a react component

Question

I do the following code, newbie in React, but it does not seem to work what it wrong here:

// React 16.x code below
import React from 'react';

// Create the Label React component here

function Label(props){
    var c = "color:'" + props.color + "'";
    return <div style="{c}">{props.value}</div>
}

// Modify this function if you want to change the preview
// It will not be evaluated as part of the assessment
export function Preview() {
    return <Label value={'Solution'} color={'blue'} />;
    // ReactDOM.render()
}

// Do not change
export default Label;

Answer 1

The style prop accepts an object, see related docs .

The style attribute accepts a JavaScript object with camelCased properties rather than a CSS string.

function Label(props) {
  return <div style={{ color: props.color }}>{props.value}</div>;
}