在反应中使用插件国际电话输入

Question

我对反应很陌生，我只想在我的表单中使用这个https://github.com/jackocnr/intl-tel-input插件。但是在文档中说使用纯 js 输入 id 查询选择器来使用插件。但是我怎样才能改变这种代码来反应使用。

文档中的代码示例：

<input type="tel" id="phone">
<script src="path/to/intlTelInput.js"></script>
<script>
  var input = document.querySelector("#phone");
  window.intlTelInput(input);
</script>

Answer 1

Jquery您应该避免在项目中使用React。你可以这样做React。

对于intl-tel-input，有react-intl-tel-input和react-intl-tel-input-v2软件包可用。

import ReactIntlTelInput from 'react-intl-tel-input-v2';
import 'intl-tel-input/build/css/intlTelInput.css';


<ReactIntlTelInput
    value={this.state.value}
    onChange={this.onChange}
/>

演示