Question

所以我试图在textfield（来自materials UI）中添加错误字符串，我希望错误显示在多行中。目前我的render方法中有这个：

<TextField
    floatingLabelText={'Input Field'}
    errorText={this.state.errorText}
    type='password'
    onChange={this.foo.bind(this)}
/>

然后在组件内部出现以下函数：

foo(e) {
    let multilineText= `First line!
                      Second line!`;
    this.setState({
        errorText: multilineText,
    });
}

我遇到的问题是错误显示在同一行。我尝试在字符串中使用\n等换行符，但它仍然在同一行显示。是否有任何特定的样式我应该将文本显示在两个单独的行中？

Answer 1

根据DOC，您可以分配任何元素，而不是分配string值：

errorText ------ node ----＆gt;要显示的错误内容。

像这样：

<TextField
    floatingLabelText={'Input Field'}
    errorText={error? <div>
                         <div>Hello</div>
                         <div>World</div>
                      </div>
                  : ''
              } 
    type='password'
    onChange={this.foo.bind(this)}
/>

在Materials-UI TextField中显示多行错误

1 个答案: