Question

当我使用{props.dollarsInputGroup ? <InputGroup><InputGroup.Addon>$</InputGroup.Addon> : ''}时，语句不起作用，因为<InputGroup>没有关闭标记。我在这里缺少什么？

更新

<FormGroup>
  {props.dollarsInputGroup ? <InputGroup><InputGroup.Addon>$</InputGroup.Addon> : ''}
  <Input />
  {props.dollarsInputGroup ? </InputGroup> : ''}
  {props.error ? <HelpBlock>{props.error}</HelpBlock> : '' }
</FormGroup>

Answer 1

您需要重复var formControl = <FormControl />; return <FormGroup> {props.dollarsInputGroup ? <InputGroup><InputGroup.Addon>$</InputGroup.Addon>{formControl}</InputGroup> : formControl} {props.error ? <HelpBlock>{props.error}</HelpBlock> : null} </FormGroup>;，或者将其定义为变量并使用两次（可能带有函数）。例如：

<FormGroup>
    {(props.dollarsInputGroup ? ((fc) => <InputGroup><InputGroup.Addon>$</InputGroup.Addon>{fc}</InputGroup>) : ((fc) => fc))(<FormControl />)}
    {props.error ? <HelpBlock>{props.error}</HelpBlock> : null}
</FormGroup>

或者......（虽然我觉得这个可读性要低得多）

function maybeWrapWithDollars(wrapWithDollars, wrappedControl) {
    if(wrapWithDollars) {
        return <InputGroup><InputGroup.Addon>$</InputGroup.Addon>{wrappedControl}</InputGroup>;
    }else{
        return wrappedControl;
    }
}
// …
<FormGroup>
    {maybeWrapWithDollars(props.dollarsInputGroup, <FormControl />)}
    {props.error ? <HelpBlock>{props.error}</HelpBlock> : null}
</FormGroup>

虽然您可以在其他地方使用定义来帮助它：

<FormGroup>
  {props.dollarsInputGroup ? <InputGroup><InputGroup.Addon>$</InputGroup.Addon><Input /></InputGroup> : <Input />}
  {props.error ? <HelpBlock>{props.error}</HelpBlock> : '' }
</FormGroup>

Answer 2

合并条件：

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout 
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:padding="20dp"
        android:weightSum="1"
        tools:context=".MainActivity">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="0dip"
        android:layout_weight=".90" />

    <Button
        android:id="@+id/addToDo"
        android:layout_width="match_parent"
        android:layout_height="0dip"
        android:layout_weight=".10"
        android:text="Add Item" />

</LinearLayout>

缺少结束标记的速记if / else语句错误

2 个答案: