#javascript #reactjs #react-native
#javascript #reactjs #react-native
Вопрос:
В настоящее время я работаю над приложением, в котором пользователи могут комментировать определенную страницу, и после комментария их комментарий должен быть первым. В настоящее время я использую приведенный ниже скрипт, но при выполнении post может отправляться на сервер, но представление не меняется
КОНТЕЙНЕРНЫЙ КОМПОНЕНТ
commentPost = () => {
const api = create({
baseURL: "baseurl.com/api",
headers: {
Accept: "application/json",
header1: this.state.communityID,
header2: userID
}
});
const self = this;
self.setState({ showCommentLoader: true });
api
.post(
"newItems/"
`${this.state.groupID}`
"/members/"
`${userID}`
"/posts/"
`${this.state.postID}`
"/comments",
{
text: this.state.newComment
}
)
.then(response => {
console.log(response);
self.setState({ showCommentLoader: false });
//updating the state
this.setState(prevState => ({
postComments: prevState.postComments.map(el => {
return {
...el,
text: this.state.comment,
likesCount: 0
};
return el;
})
}));
});
};
Вид
<View>
<Text
style={{
paddingLeft: 10,
fontSize: 16,
color: "#4a4a4a",
fontFamily: "HelveticaNeue-Light"
}}
>
{item.text}
</Text>
<TouchableOpacity
onPress={() => checkLikeDisLike(item)}
style={{
alignSelf: "flex-start",
position: "relative",
top: 5,
paddingLeft: 10
}}
>
<Text style={{ fontSize: 14 }}>
{item.likesCount}
{"n"}
</Text>
<Icon name="md-thumbs-up" type="ionicon" />
</TouchableOpacity>
<TouchableOpacity
style={{
alignSelf: "flex-end",
position: "relative",
top: -20,
paddingRight: 5,
paddingBottom: 20
}}
>
<Icon name="ios-chatboxes" type="ionicon" color="#517fa4" />
</TouchableOpacity>
</View>
Что я могу сделать, чтобы отобразить комментарий после его отправки на сервер, точно так же, как вы можете сделать в native javascript unshift
Ответ №1:
Из вашего кода похоже, что вам не нужно self
просто вызывать this.setState
напрямую.
Но setState не меняется, потому что вы устанавливаете состояние, используя свою старую ссылку на массив. используйте это, чтобы скопировать ваш массив в новую переменную var newArray = oldArray.slice();
, а затем установить для нее значение state.
Что-то вроде этого:
Однако я не проверяю ваше сопоставление,
const newArray = this.state.postComments.slice();
// do your mapping changes here
this.setState({postComments: newArray});
Комментарии:
1. я не понимаю, можете ли вы вставить это в мой код?