Я пытаюсь передать некоторые параметры из TextInput в тело в Axios.Он не отображает никаких ошибок и не возвращает состояние с помощью console.log ().
У меня есть несколько способов узнать, в чем может быть проблема.Я попытался передать функцию в ComponentDiDMount и некоторые другие жизненные циклы компонентов, но безуспешно.Я также передал значения напрямую, использовал Json.parse (), JSON.encode (), JSON.stringify (), без ошибок и пока не возвращал статус.Я знаю, что может быть ошибка, которую я делаю.Более того, я не знаю, делаю ли я это неправильно.Я пытаюсь получить данные в раскрывающемся списке, из которого мне нужно использовать ключ, чтобы передать соответствующий идентификатор выбранного значения в category_id.Когда страница загружается, она выбирает «категорию», т. Е. Имя поля с соответствующим идентификатором для раскрывающегося списка, но только соответствующее необходимо для передачи в Axios.post.
import React, { Component } from 'react';
import {
Text,
TextInput,
View,
Image,
TouchableOpacity,
Button,
StyleSheet} from 'react-native';
import { Dropdown } from 'react-native-material-dropdown';
import axios from 'axios';
export default class CreatePost extends Component {
constructor(props){
super(props)
this.state = {
category: [],
title: '',
cat: '',
author:'',
body:''
}
}
static navigationOptions = ()=> {
return{
title: null,
headerStyle: { backgroundColor: '#1A5276', color:'#fff' },
header:null
}
};
componentWillMount(){
axios.get(`http://localhost/rest_api_myblog/api/category/read.php`)
//.then(json => console.log(json.data.data[0].name))
.then(json => json.data.data)
.then(newData => this.setState({category: newData}))
.catch(error => alert(error))
}
onChangeTextPress(key, value){
this.setState((prevState) => {
//let selected = Object.assign({}, prevState.selected);
let selected = Object.assign({},prevState.selected);
selected[key] = value;
return { selected };
}, () => {
this.setState({ cat: this.state.selected[key]});
// console.log(cat);
});
}
onCreate = event => {
event.preventDefault();
const body = {
author :this.state.author,
title : this.state.title,
body : this.state.body,
category_id :this.state.cat
};
axios.post(`http://localhost/rest_api_myblog/api/post/create.php`, JSON.parse(body))
.then(res => {console.log(res)
})
.catch(e => console.log(e));
}
render() {
const data = this.state.category.map((cat, i) =>({
value: cat.name,
key: i
}));
return (
<View style= {styles.container}>
<View><Image style={styles.image} source={require('../images/blog.jpg')}/>
<Text style={styles.header}>Create Post</Text></View>
<View style={{alignItems:'center'}}>
<Text style= {styles.label}>Title</Text>
<TextInput
style={styles.textbox}
placeholder="Title"
onChangeText= {(title)=>{
this.setState({title});
}}
value={this.state.title}/>
<Text style= {styles.label}>Author</Text>
<TextInput
style={styles.textbox}
name='author'
placeholder="Author"
onChangeText= {(text)=>{
this.setState({author: text});
}}
value={this.state.author}
/>
<Text style= {styles.label}>Category</Text>
<Dropdown
dropdownOffset={{top:5, left: 0 }}
containerStyle={{
borderWidth:1,
borderColor:'lightgrey',
borderRadius:13, width:300, height: 40,
paddingLeft:6,
backgroundColor:'#fff'}}
rippleCentered={true}
inputContainerStyle={{ borderBottomColor: 'transparent' }}
data = {data}
valueExtractor={({value})=> value}
onChangeText={(value, key)=>{this.onChangeTextPress( value, key)}}
/>
<Text style= {styles.label}>Body</Text>
<TextInput
style={styles.textbox}
multiline = {true}
numberOfLines = {4}
placeholder="Body"
onChangeText= {(body)=>{
this.setState({body});
}}
value={this.state.body}
/>
<TouchableOpacity style={styles.buttonContainer}
onPress = {()=> {this.onCreate }}
>
<Text style={styles.buttonText}>Create</Text>
</TouchableOpacity>
</View>
</View>
)
}
}
На самом деле мне нужен метод post, основанный на значениях TextInput, введенных пользователями.Более того, соответствующий идентификатор выбранного выпадающего значения будет передан вместо фактического значения.
Большое спасибо за вашу помощь.