首页 > 解决方案 > 在反应中使用插件国际电话输入

问题描述

我对反应很陌生,我只想在我的表单中使用这个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>

标签: reactjs

解决方案


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

对于intl-tel-input,有react-intl-tel-inputreact-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}
/>

演示


推荐阅读