Question

Flow允许您指定可选道具：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="dynamicTable1">
  <thead>
    <th>Id</th>
    <th>Name</th>
    <th>Age</th>
    <th>Place</th>
    <th>Skill</th>
  </thead>
  <tr>
    <td><input type="text" id="fld1" /></td>
    <td><input type="text" id="fld2" /></td>
    <td><input type="text" id="fld3" /></td>
    <td><input type="text" id="fld4" /></td>
    <td><input type="text" id="fld5" /></td>
    <td><button class="remove">Remove</button></td>
  </tr>


  <tr>
    <td><input type="text" id="fld1" /></td>
    <td><input type="text" id="fld2" /></td>
    <td><input type="text" id="fld3" /></td>
    <td><input type="text" id="fld4" /></td>
    <td><input type="text" id="fld5" /></td>
    <td><button class="remove">Remove</button></td>
  </tr>

</table>

<input type="button" id="addrow" value="Add New Row" />

<table class="samplerow" style="display:none">
  <tr>
    <td><input type="text" id="fld1" /></td>
    <td><input type="text" id="fld2" /></td>
    <td><input type="text" id="fld3" /></td>
    <td><input type="text" id="fld4" /></td>
    <td><input type="text" id="fld5" /></td>
    <td><button class="remove">Remove</button></td>
  </tr>
</table>

如果你没有传入一个值，那么道具将被设置为＆＃34; undefined＆＃34;。

使用这些替代所需的道具加上默认值是否是一种好的做法？显然设置默认值似乎更好，而不是处理有一个＆＃34; undefined＆＃34;丙

Answer 1

如果您正在编写类型来描述来自第三方库或服务的对象，那么最好尽可能准确地描述它们。

如果您只是为自己的代码编写类型，那么它实际上是一种设计选择。例如，如果您有一个返回大型对象集合的JSON表示的服务，每个对象都包含许多null值，那么只需从JSON中省略它们就可以大大减少解析开销。

明确设置默认值似乎更好，而不是处理具有“未定义”道具的可能性。

Flow将阻止您忘记处理可能未定义的值。将大量默认值复制到数据结构中可能会造成浪费，而只需检查它是否在您需要使用它时丢失。

如果您没有大量的对象且性能不是问题，那么这可能只是风格或偏好的问题。

如果您严格谈论React组件的道具，那么使用显式默认值通常是最好的，因为它将有助于使您的组件自我记录。对于组件的用户来说，默认值将更加明显，而不是深埋在实现中。

是否有任何理由在Flow中使用可选道具？

1 个答案: