时间戳

首页 > 解决方案 > 对象或非对象的函数属性，有什么区别？

javascript - 对象或非对象的函数属性，有什么区别？

问题描述

通过使用“function(style)”它不起作用，但是当使用“function({style})”它起作用时，请解释为什么？

正确的代码：

export default function Title( { title } ) {
  return (
    <div className="section-title">
      <h4>{title}</h4>
      <div />
    </div>
  );
}

错误代码：

export default function Title( title ) {
  return (
    <div className="section-title">
      <h4>{title}</h4>
      <div />
    </div>
  );
}

标签： javascriptreactjsfunctionproperties

解决方案

功能组件将props 对象作为参数。

使用下面的代码行，您正在解构title道具，这是正确的。

export default function Title( { title } )

在下面，您将标题作为对象接收并渲染它，这是错误的，因为在反应中您无法渲染对象。

export default function Title( title ) {
  return (
    <div className="section-title">
      <h4>{title}</h4>
      <div />
    </div>
  );
}

另一个正确的方法是

export default function Title( props ) {
  return (
    <div className="section-title">
      <h4>{props.title}</h4>
      <div />
    </div>
  );
}

推荐阅读