Javascript 为什么道具变量可以'；不能被拆毁吗？

我有一段JSX代码，我不明白为什么其中一个变体不起作用。在我看来，props变量必须被破坏，但它不会发生

jsbin上有一个代码段：

//很好用
常量Hello=（props）=>{props.message}
//但它会产生一个错误
//常量Hello=（{message}）=>{message}
//为什么我不能解构props变量？
ReactDOM.render(
,
document.getElementById（'root'））
);

在JSBin上引发的错误是：

分析错误：第2行：意外标记=>错误：分析错误：第2行：意外标记=>

我希望这句话是正确的

const Hello=（props）=>{props.message}

及

const Hello=（{message}）=>{message}

---

应该是等效的，但它不是这样工作的。为什么？

我们可以将解构与道具一起使用，但由于解构是ES6的一项功能，因此您也必须使用Babel

只需将JSBin中的下拉列表从JSX（React）更改为ES6/Babel，就可以了

---

希望这能回答您的问题。

//但它会生成一个错误

错误说明了什么？这可能很重要。JSBin仍在使用不推荐使用的JSXTTransformer。理想情况下，他们会切换到更现代的东西。嗯，所以尽管有一个

JSX（React）

选项，

ES6/Babel

选项也可以完美地（甚至更好地）与JSX和React一起工作。这不是我所期望的，你知道

JSX（React）

选项的意义是什么吗？（还要注意的是，箭头函数也是ES6的一个特性，但它们不会抛出-看起来像是JSXTTransformer的问题）

// It's works fine
const Hello = (props) => <h1>{props.message}</h1>

// But it generates an error
//const Hello = ({message}) => <h1>{message}</h1>

// Why I can't deconstruct the props variable?


ReactDOM.render(
    <Hello message="Hello" />,
    document.getElementById('root')
);