javascript - 如何正确导出反应组件

Question

我在 React 中执行以下代码，新手，但它似乎在这里没有工作它的错误：

// 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;

标签： javascriptreactjs

Answer 1

该style道具接受一个对象，请参阅相关文档。

style 属性接受带有 camelCased 属性的 JavaScript 对象，而不是 CSS 字符串。

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