小编Mad*_*ary的帖子

我正在尝试react-phone-input-2在我的表单中使用它，因为它提供了许多功能，例如标志和格式编号等。

但是我无法使用自己的 css 自定义输入。例如：高度，宽度

此外，我导入了与使用材料 ui 的所有其他组件相同的包提供的材料 css。

import PhoneInput from 'react-phone-input-2';
import 'react-phone-input-2/lib/material.css';

<div>
<PhoneInput 
   country={'us'}
   value={this.props.receiverPhone}
   className={classes.phoneNumber}
   fullWidth="true"
   onChange={(phone) => this.props.changePhoneNumber(phone)}
/>
</div>

我的风格

    phoneNumber: {
      [theme.breakpoints.down('sm')]: {
        width: '95%',
      },
      [theme.breakpoints.up('md')]: {
        width: '93%',
      },
      [theme.breakpoints.up('lg')]: {
        width: '82%',
      },
      padding: '5px',
      height: '40px',
      marginTop: theme.spacing(2),
      marginRight: theme.spacing(1),
      marginBottom: theme.spacing(3),
    },

我也试过给予style={{width:100, height:40}}和InputProps{{className:classes.phoneNumber}}作为道具，<PhoneInput>但看起来即使这也不起作用。有没有其他方法可以解决这个问题？