Question

我正在使用左侧用户输入的填充标准化器。我的功能是：

export const padLeft = (num, len) => (
  len > num.toString().length ? '0'.repeat(len - num.toString().length) + num
    : num
);

我的规范化器就是这样：

const normalizeCid = (value) => {
  return padLeft(value, 8);
};

当我在我的Field组件中使用它时，如下所示：

<Field
        id="searchCif"
        name="searchCif"
        floatingLabelText={SEARCHVIEW_HINT_CIF}
        component={InputTextField}
        disabled={(props.afm !== undefined)}
        normalize={normalizeCid}
      />

并且我输入例如2的输入它显示00000002这是正确的但是当我输入23时，零没有减少。它显示了000000023.为什么会发生这种情况？

Answer 1

我认为函数normalizeCid 是运行时每次更改值，但是第一次运行它并输入'2'时，传递给padLeft的值是2，它返回并显示 00000002.

然后，当你向显示的值（00000002）添加一个'3'时，传递给padLeft的值是000000023，其长度为9，大于8，所以它只是返回原始值。

所以问题是padLeft函数中的错误逻辑。

padLeft函数似乎有效，只要它传递一个没有任何前导零的数字，所以我们可以通过使用Regex删除前导零来解决问题，然后再将值传递给{{1 }}：

padLeft

注意：此建议可能不适用于所有边缘情况，因此您可能需要在某处添加一些额外条件。

Normalize仅以redux形式调用一次

1 个答案: