jjzjj

javascript - 我应该在 React 组件中初始化一个空状态变量吗？

coder 2024-07-25 原文

我对 React 还是有点陌生​​，我觉得它很棒，但目前有一件事在我脑海中，我想知道如何看待它。

例如，我正在制作一个结账组件，其中有一个减价优惠券字段。

我将事件的当前价格传递给优惠券，以便它可以计算新的:

{this.state.showCouponField ? (
  <CouponForm
    validateCoupon={(coupon) => this.setState({ coupon: coupon })}
    initialValue={this.state.coupon ? this.state.coupon.token : ''}
    initialPrice={this.state.event.final_price}
    setReducedPrice={(reducedPrice) => this.setState({ reducedPrice })}
  />
) : null}

然后显示:

<p className="lead">
  Total :
  <span className="pull-right">
    {this.state.reducedPrice ? (
      <span>
        <s>
          {isFree ? 'Gratuit' : `${event.real_final_price * this.state.participants} €`}
        </s>
        &nbsp;
        {this.state.reducedPrice === 0 ? 'Gratuit' : `${this.state.reducedPrice / 100 * this.state.participants} €`}
      </span>
    ) : (
      <span>
        {isFree ? 'Gratuit' : `${event.real_final_price * this.state.participants} €`}
      </span>
    )}
  </span>
</p>

但例如，在有人使用优惠券之前，变量 reducedPrice 为空。

问题是:将 reducedPrice 设置为初始状态是否是一个好习惯

constructor(props) {
  super(props);
  this.state = {
    event: null,
    creditCards: [],
    selectedCardId: null,
    addCreditCard: false,
    participants: 1,
    coupon: null,
    total: 0,
    error: null,
    loading: false,
    bookingId: null,
    user: null,
    showCardOptions: false,
    showModal: false,
    modalUrl: null,
  };

  this.updatePaymentMeans = this.updatePaymentMeans.bind(this);
}

所有这些空变量对我来说似乎都是无用的，因为它们默认为空，而且不需要初始化它们——或者我还没有看到错误——因为状态是一个对象，所以它可以动态创建。

我知道我会忘记其中的一些，所以我想知道我是否会简单地不设置它们，这样如果我错过一个，它就会明显崩溃。

开放式问题 :D

最佳答案

将它们设置为 null 或 undefined 将导致相同的结果/错误，因为您很少会使用三等号来比较它的存在。

selectedCreditCardId ? something : else

但是话又说回来，同样的事情发生在 true/false 上，与其他类型(字符串，数字，......)相反，你很少使用三重 -两者都相等。

所以它与完全相同:this.state = { isTall: false }，而不是完全没有它

是高吗？是:否

仍然会给您相同的结果。 (此示例旨在为您提供更好的链接上下文，稍后我将向您展示)

IMO，因为这是一个自以为是的问题
将它们定义在顶部，而不是将它们分布在渲染方法中，将提供有关当前状态和下一个状态的快速概览。

做什么，只要确保保持一致。

您可能还想检查:

关于javascript - 我应该在 React 组件中初始化一个空状态变量吗？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41503066/

javascriptReactcodethisstatereactjs

有关javascript - 我应该在 React 组件中初始化一个空状态变量吗？的更多相关文章

  1. ruby-on-rails - 未初始化的常量 Psych::Syck (NameError) - 2

    在我的gem中，我需要yaml并且在我的本地计算机上运行良好。但是在将我的gem推送到ruby​​gems.org之后，当我尝试使用我的gem时，我收到一条错误消息=>"uninitializedconstantPsych::Syck(NameError)"谁能帮我解决这个问题？附言RubyVersion=>ruby1.9.2,GemVersion=>1.6.2,Bundlerversion=>1.0.15 最佳答案 经过几个小时的研究，我发现=>“YAML使用未维护的Syck库，而Psych使用现代的LibYAML”因此，为了解决

  2. ruby - 使用 Vim Rails，您可以创建一个新的迁移文件并一次性打开它吗？ - 2

    使用带有Rails插件的vim，您可以创建一个迁移文件，然后一次性打开该文件吗？textmate也可以这样吗？ 最佳答案 你可以使用rails.vim然后做类似的事情::Rgeneratemigratonadd_foo_to_bar插件将打开迁移生成的文件，这正是您想要的。我不能代表textmate。 关于ruby-使用VimRails，您可以创建一个新的迁移文件并一次性打开它吗？，我们在StackOverflow上找到一个类似的问题： https://sta

  3. ruby-on-rails - Rails - 一个 View 中的多个模型 - 2

    我需要从一个View访问多个模型。以前，我的links_controller仅用于提供以不同方式排序的链接资源。现在我想包括一个部分(我假设)显示按分数排序的顶级用户(@users=User.all.sort_by(&:score))我知道我可以将此代码插入每个链接操作并从View访问它，但这似乎不是“ruby方式”，我将需要在不久的将来访问更多模型。这可能会变得很脏，是否有针对这种情况的任何技术？注意事项:我认为我的应用程序正朝着单一格式和动态页面内容的方向发展，本质上是一个典型的网络应用程序。我知道before_filter但考虑到我希望应用程序进入的方向，这似乎很麻烦。最终从任何

  4. ruby-on-rails - 渲染另一个 Controller 的 View - 2

    我想要做的是有2个不同的Controller，client和test_client。客户端Controller已经构建，我想创建一个test_clientController，我可以使用它来玩弄客户端的UI并根据需要进行调整。我主要是想绕过我在客户端中内置的验证及其对加载数据的管理Controller的依赖。所以我希望test_clientController加载示例数据集，然后呈现客户端Controller的索引View，以便我可以调整客户端UI。就是这样。我在test_clients索引方法中试过这个:classTestClientdefindexrender:template=>

  5. ruby - 检查 "command"的输出应该包含 NilClass 的意外崩溃 - 2

    为了将Cucumber用于命令行脚本，我按照提供的说明安装了arubagem。它在我的Gemfile中，我可以验证是否安装了正确的版本并且我已经包含了require'aruba/cucumber'在'features/env.rb'中为了确保它能正常工作，我写了以下场景:@announceScenario:Testingcucumber/arubaGivenablankslateThentheoutputfrom"ls-la"shouldcontain"drw"假设事情应该失败。它确实失败了，但失败的原因是错误的:@announceScenario:Testingcucumber/ar

  6. ruby-on-rails - 如何使用 instance_variable_set 正确设置实例变量？ - 2

    我正在查看instance_variable_set的文档并看到给出的示例代码是这样做的:obj.instance_variable_set(:@instnc_var,"valuefortheinstancevariable")然后允许您在类的任何实例方法中以@instnc_var的形式访问该变量。我想知道为什么在@instnc_var之前需要一个冒号:。冒号有什么作用？ 最佳答案 我的第一直觉是告诉你不要使用instance_variable_set除非你真的知道你用它做什么。它本质上是一种元编程工具或绕过实例变量可见性的黑客攻击

  7. ruby - 通过 ruby​​ 进程共享变量 - 2

    我正在编写一个gem，我必须在其中fork两个启动两个webrick服务器的进程。我想通过基类的类方法启动这个服务器，因为应该只有这两个服务器在运行，而不是多个。在运行时，我想调用这两个服务器上的一些方法来更改变量。我的问题是，我无法通过基类的类方法访问fork的实例变量。此外，我不能在我的基类中使用线程，因为在幕后我正在使用另一个不是线程安全的库。所以我必须将每个服务器派生到它自己的进程。我用类变量试过了，比如@@server。但是当我试图通过基类访问这个变量时，它是nil。我读到在Ruby中不可能在分支之间共享类变量，对吗？那么，还有其他解决办法吗？我考虑过使用单例，但我不确定这是

  8. ruby-on-rails - 如果 Object::try 被发送到一个 nil 对象，为什么它会起作用？ - 2

    如果您尝试在Ruby中的nil对象上调用方法，则会出现NoMethodError异常并显示消息:"undefinedmethod‘...’fornil:NilClass"然而，有一个tryRails中的方法，如果它被发送到一个nil对象，它只返回nil:require'rubygems'require'active_support/all'nil.try(:nonexisting_method)#noNoMethodErrorexceptionanymore那么try如何在内部工作以防止该异常？ 最佳答案 像Ruby中的所有其他对象

  9. ruby - 为什么 SecureRandom.uuid 创建一个唯一的字符串？ - 2

    关闭。这个问题需要detailsorclarity.它目前不接受答案。想改进这个问题吗？通过editingthispost添加细节并澄清问题.关闭8年前。Improvethisquestion为什么SecureRandom.uuid创建一个唯一的字符串？SecureRandom.uuid#=>"35cb4e30-54e1-49f9-b5ce-4134799eb2c0"SecureRandom.uuid方法创建的字符串从不重复？

  10. ruby-on-rails - 未在 Ruby 中初始化的对象 - 2

    我在Rails工作并有以下类(class):classPlayer当我运行时bundleexecrailsconsole然后尝试:a=Player.new("me",5.0,"UCLA")我回来了:=>#我不知道为什么Player对象不会在这里初始化。关于可能导致此问题的操作/解释的任何建议？谢谢，马里奥格 最佳答案 havenoideawhythePlayerobjectwouldn'tbeinitializedhere它没有初始化很简单，因为你还没有初始化它!您已经覆盖了ActiveRecord::Base初始化方法，但您没有调

随机推荐