想要在特定情况下显示标签

时间:2018-10-23 10:02:25

标签: reactjs

我要在用户名已经存在时显示标签。.我需要应用什么条件..这是我的代码。

handleCheck = () => {
    this.props.form.validateFields((err, values) => {
        this.props.checkUser(values,this.props.companyId);
    });
    this.setState({checkFlag:true});
};

<Col span={12} >
    <FormItem>
        {getFieldDecorator('UserName', {
            initialValue: "",
            rules: [{
                required: true, message: 'Please Input your UserName!',
            }],
        })(                                
            <Input placeholder="UserName" onChange={this.handleCheck} />              
        )}
    </FormItem>
</Col> 

{(here condition)?
    <label for="test" style={{"color":"red","paddingLeft":"54%","fontSize":"13px"}}>Username already exists</label>:''
}

1 个答案:

答案 0 :(得分:0)

我假设此函数this.props.checkUser返回的是真还是假。

将handleCheck函数更改为

handleCheck = () => {
    this.props.form.validateFields((err, values) => {
       let isUserExist = this.props.checkUser(values,this.props.companyId);
        this.setState({checkFlag:isUserExist});
    });
};

JSX更改

{this.checkFlag && 
    <label for="test" style="color:red;paddingLeft:54%;fontSize:13px">Username already exists</label>}