javascript - 将 props 传递给 React 组件的最简洁方法？

Question

这是我的 react 钩子(Hook)代码。

function onClick(){
  alert('clicked')
}
var className='clicker'
function Clicker1(){
  return <div {...{onClick,className}}>clicker 1</div>
}
function Clicker2(){
  var props={onClick,className}
  return <div {...props}>clicker 2</div>
}
function Clicker3(){
  return <div className={className} onClick={onClick}>clicker 3</div>
}
function Clickers(){
  return <><Clicker1/><Clicker2/><Clicker3/></>
}
ReactDOM.render(<Clickers/>,document.getElementById('root'));

它演示了将 props 传递给组件的三种不同风格。它们都工作得很好。我最喜欢的风格是答题器 1。

我的问题是:有没有更简洁的方式来传递 props？

编辑:这个问题不是基于选项的，它是关于简洁的表示，可以准确地测量字符数，不需要选项

Answer 1

似乎有一些东西正在进行中，但尚未合并 https://github.com/facebook/jsx/pull/121