react-native - 不变违规:文本字符串必须在组件,在 React Native 中使用条件运算符时发生
问题描述
使用条件运算符根据某些条件显示某些组件后,出现此错误。以下是代码。
{this.state.isOk==false ? (
<View>
<TextInput value={this.state.title } />
<Text style={LocalStyles.errorText}>{this.state.errorTitle}</Text>
<TextInput value={ this.state.company } />
<Text style={LocalStyles.errorText}>{this.state.errorCompany}</Text>
<View>
<CheckBox value={this.state.isCurrent} />
</View>
{this.state.isCurrent==false ? (
<Date
value={this.state.from }
placeholder={strings("user_profile.from")}
maxDate={moment().subtract(1, "years")}
onChange={time => {
this.setState({ from: time });
}}/>
<Text style={LocalStyles.errorText}>{this.state.errorDate}</Text>
) : null}
<TextInput label={this.state.location} />
<Text style={LocalStyles.errorText}>{this.state.errorLocation}</Text>
<TextInput multiline={true} value={ this.state.description} />
<Text style={LocalStyles.errorText}>{this.state.errorDesc}</Text>
</View>
): null}
这是 Text 组件的样式
errorText: {
color: "red",
paddingLeft: 10,
paddingRight: 10,
flexDirection: 'row',
},
解决方案
在这种情况下,您应该返回一个空的,而不是null
像文本一样处理的返回<View/>
。
推荐阅读
- node.js - 在多个节点 js 应用程序上应用相同的快速会话
- sql - 查询时的postgresql数据格式
- ruby-on-rails - 动作文本附件标签未显示在 React 前端
- c++ - 你如何压缩数据并将其放入向量中?
- android - 处理 Koin 组件内的异常
- fortran - PARPACK 实现遇到内存错误
- django - 即使在表单中传递实例后,ModelForm 也会验证新实例的数据
- python - 使用 Lambda 从 S3 上的 CSV 文件在 S3 上创建一个 zip 文件
- javascript - 在这种情况下,为什么 `push` 方法对对象起作用?
- reactjs - react native android app to react native web app