如何在语义React UI中扩展Input的宽度大小?

庆特

我正在使用Reactjs项目,并且使用语义UI React来美化Input但是,似乎Input总是以默认大小显示。如何调整其水平宽度?

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.12/semantic.min.css"></link>

  • 在我导入的js文件中:

import { Input } from 'semantic-ui-react';

  • 并渲染输入:

<Input value={this.state.firstName} onChange={this.handleInputFirstName}/>

斯瓦普尼尔

添加style={{ width:"300px" }}对我来说很好。我正在使用与您相同的样式表。您可以看一下以下代码:

const App = () => (
  <div style={styles}>
    <h2>Start editing width and see magic happen {'\u2728'}</h2>
    <Input placeholder="Hello there" style={{width: "370px"}}/>
  </div>
);

工作示例可以在这里看到:
编辑StackOverflow 2

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章