3

如何设置 TextField 的最大宽度？默认情况下，宽度设置为最大尺寸默认文本字段宽度

4

3 回答 3

3

你可以通过实现你自己的样式函数来设置组件的最大宽度属性，就像在这个 Codepen 示例中所做的那样。

const getStyles = () => {
  return {
    root: {
      maxWidth: '100px'
    }
  }
};

<TextField 
  id='myTextField'
  spellcheck={ false }
  name='bar'          
  placeholder='Placeholder text' 
  defaultValue='Default text'
  styles={ getStyles }
/>

有关此方法的更多文档可以在https://github.com/OfficeDev/office-ui-fabric-react/wiki/Component-Styling#styles-prop找到。

于 2018-08-20T20:25:10.747 回答
0

您可以向组件添加style属性<TextField>：

<TextField
   ...
   style={{maxWidth: '100px'}} 
/>

我希望它会帮助你。

于 2018-09-20T11:30:44.047 回答
-1

尝试使用 max-width 设置容器应具有的最大宽度。

.text-field{
  width: 100%;
  max-width: 500px;
  height: 50px;
  border: 2px solid black;
}
<div class="text-field">
  <p>example<p> 
<div>

于 2018-08-18T00:27:06.363 回答