输入IP掩码，如225.222.324.222/32

Question

我正在使用 React.js 我需要为具有 networg 范围的 IP 创建一个输入掩码，Ips 看起来像：22.23.23.14/32 或例如 111.111.111.111./20。 如何创建输入字段，使其具有如下掩码：.../___

谢谢！ 寻找图书馆

Answer 1

您可以使用

react-text-mask

轻松将蒙版应用到输入字段。

import React from 'react';
import MaskedInput from 'react-text-mask';

const IpInput = () => {
  const ipMask = [
    /\d/,
    /\d/,
    /\d/,
    '.',
    /\d/,
    /\d/,
    '.',
    /\d/,
    /\d/,
    '.',
    /\d/,
    /\d/,
    '/',
    /\d/,
    /\d/,
  ];

  return (
    <div>
      <label>IP Address:</label>
      <MaskedInput mask={ipMask} placeholder=".../__" guide={false} />
    </div>
  );
};

export default IpInput;

/

和

__

是掩码的静态部分，

\d

部分代表数字。

guide={false}

道具用于隐藏遮罩未填充的部分。