Блог

Я новичок в родной реакции, я создал массив объектов, подобных этому:

 const [survey,setSurvey]=useState([{surveyNo:"1"},{surveyNo:"2"},{surveyNo:"3"}]);  

Теперь я создаю динамический компонент, используя «опрос», определенный выше, вот так:

 return (  lt;ScrollViewgt;   {  survey.map(function(dd, idx)  {  return(  lt;View style={styles.survey}gt;   lt;Text style={{fontWeight:"bold",marginTop:15}}gt;  {"Survey Number"}  lt;/Textgt;    lt;TouchableOpacity   onPress = {() =gt; deleteSurvey(idx)}  style={{  position:"absolute",  right:0,  }}gt;  lt;Image  style={{  width: 30,  height: 30,  marginTop: 15,  marginRight:10,    }}  source={deleteIcon}  /gt;  lt;/TouchableOpacitygt;    lt;TextInput  onChangeText={(e)=gt;setSurvey(setSurveyNo(idx,e))}  value={()=gt;getSurveyNo(idx)}  keyboardType="numeric"  /gt;  )  }  } lt;/ScrollViewgt; );  

Это функция deleteSurvey:

 function deleteSurvey(index) { console.log("INDEX::::" index); console.log("Deleted Survey Number:"); console.log(survey[index].surveyNo); setSurvey([...survey.slice(0, index),...survey.slice(index 1)]); console.log("Updated Survey No at " index ":"); console.log(survey[index].surveyNo); console.log("Sliced survey:"); console.log(survey); console.log("Sliced temp:"); console.log([...survey.slice(0, index),...survey.slice(index 1)]); }   

Это метод SetSurveyNo:

 function setSurveyNo(index,value) {  let temp=survey;  temp[index].surveyNo=value;  return temp;  }  

Это метод getSurveyNo:

 function getSurveyNo(index) {  let temp=survey;  return temp[index].surveyNo }  

Это вывод из console.log функции deleteSurvey после того, как я нажму кнопку удалить на втором элементе (с индексом 1).:

 INDEX::::1 Deleted Survey Number: 2 Updated Survey No at 1: 2 Sliced survey: Array [  Object {  "surveyNo": "1",  },  Object {  "surveyNo": "2",  },  Object {  "surveyNo": "3",  }, ] Sliced temp: Array [  "surveyNo": "1",  },  Object {  "surveyNo": "3",  }, ]  

Как вы можете видеть, временный вывод показывает правильное значение (удаленный элемент 2 не отображается), в то время как переменная «обзор» еще не обновлена.

Это вызывает проблемы при визуализации, потому что после удаления второго компонента третий элемент с «surveyNo», равным «3», не отображается, в то время как желательным поведением должно было быть то, что второй элемент с «surveyNo», равным «2», не должен отображаться, поскольку он был удален.

Извините за длинный вопрос, но я застрял в этой проблеме с 1 дня и очень расстроен.

Пожалуйста, помогите мне решить эту проблему.