使用屏蔽的反应输入合并语义UI反应输入

Question

任何人都知道合并两个反应输入组件的最佳方法吗？优选地，因为它涉及semantic-ui-react和react-text-mask。这是我到目前为止所得到的（我无法将道具传递给蒙面子组件）：

import React from "react";
import { Input } from "semantic-ui-react";
import MaskedInput from "react-text-mask";

const CustomInput = () => (
  <div>
    <Input focus placeholder="Search...">
      <MaskedInput
        mask={[
          "(",
          /[1-9]/,
          /\d/,
          /\d/,
          ")",
          " ",
          /\d/,
          /\d/,
          /\d/,
          "-",
          /\d/,
          /\d/,
          /\d/,
          /\d/
        ]}
        guide={true}
      />
    </Input>
  </div>
);

export default CustomInput;

Answer 1

你可以使用

将所有道具传递给孩子

0x565556c0

在你的情况下，只需将“输入”道具传递给“MaskedInput”，如

{...this.props}