Question

在某些情况下，getter方法变得很方便。但是，使用getter方法呈现React组件或整个DOM呢？为此，使用经典方法代替吸气剂是否更好？而为什么呢？

我有种感觉不对劲，但我也知道这些东西可能与作者的感觉有关。

所以问题是，这通常是否是个好方法？还是您的喜好是什么？

class Attachment extends React.Component {

  get file() {
    return this.props.fields.File;
  }
  get label() {
    return this.props.fields.Label;
  }

  // I'm asking about these 2 getters below this comment

  get editableAttachment() {
    return <SomeComponent field={this.label} />;
  }

  get attachment() {
    return (
      <a
        href={this.file && this.file.value && this.file.value.src}
        target="_blank"
      >
        {(this.label && this.label.value)}
      </a>
    );
  }

  render() {
    return (
      <div className="ui-some-component">
        {this.props.isPageEditing ? this.editableAttachment : this.attachment}
      </div>
    );
  }
}

谢谢。

Answer 1

这非常符合消费者的口味，我相信，如果您不引入野蛮性，那么任何代码都是好的。

同样，代码越容易理解，越好。对于不认识我的代码的人，我会尽量使代码简单易读。

另一方面，我尝试使这些组件尽可能简单且易于呈现。

也许这将是您使用“我的样式指南”的代码的示例：

const Attachment = ({ isPageEditing, fields }) => {
  const { file, label } = fields;

  const attachment = isPageEditing ? (
    <SomeComponent field={fields.label} />
  ) : (
    <a href={file && file.value && file.value.src} target="_blank">
      {label && label.value}
    </a>
  );

  return <div className="ui-some-component">{attachment}</div>;
};

希望我能对您有所帮助，最好

Answer 2

我认为这取决于偏好。与更基础的if x do this, if y do that渲染相比，推迟计算不会有任何好处-两者都必须做。

我的两分钱是保持组件简单易读。在每种情况下跳转一个类会使下一个开发人员更加困难。

使用getter渲染React组件内的另一个组件是一种好习惯吗？

2 个答案: