مشکل در ری اکت

کدتو قرار بده

state های کامپونت

state={  
currentVar:{VarTitle:null,varType:null},  
varList:[],  
errors:{},dialogDisplay:false,  
toast:{  
id:"ManageMagicVar_toast",cook:false,type:"",text:"",icon:""  
}  
}

input که مقدار value متصله به state.curentvar.varTitle

<TextInput
                            with="100%"
                            name="VarTitle"
                            lable="عنوان متغیر"
                            placeholder="لطفا عنوان متغیر را وارد کنید"
                            isRequired={true}
                            error={errors.VarTitle}
                        onChange={this.handleVarTitle}
                        value={currentVar.VarTitle}
                        />

باتنی که مقدار رو تویه آرایه پوش میکنه

 CreateVar(){
        var {varList,currentVar}=this.state;
        varList.push(currentVar);
        this.setState({varList});

    }

الان من با یه کد مشابه همین رو تست کردم هیچ مشکلی نداشت

لطفا کدتو بذار

class App extends Component {
  constructor(props) {
    super(props);

    this.state = {
      currentVar: '',
      varList: [],
    }
  }

  setVal = () => {
    let {varList,currentVar}=this.state;
    varList.push(currentVar);
    currentVar =  ''; 
    this.setState({varList, currentVar});
  }

  setCurrent = (e) => {
    let currentVar = e.target.value
    this.setState({currentVar});
  }

  render() {
    var { varList, currentVar } = this.state;
    return (
      <div className="App">
        <input
          onChange={this.handleVarTitle}
          value={currentVar.VarTitle}
          onChange={this.setCurrent}
        />
        <button onClick={this.setVal}>set</button>
      </div>
    );
  }
}

export default App;

سلام
باید موقعی ک varList رو پر میکنی اطلاعات قبلی هم بهش اضافه کنی

let varList=this.state.varList;
varList={...varList};
varList.push(currentVar)