如何在 React Native 中发布数据？答案

【问题标题】：How to post data in React Native?如何在 React Native 中发布数据？
【发布时间】：2020-01-19 03:55:30
【问题描述】：

我已经编写了这段代码来在 url 中发布数据但不工作，这是我的 Json 文件

[{
        "id": 9,
        "questionnairename": "sfdsdf",
        "created_at": null,
        "updated_at": null,
        "questionnairecontent": null,
        "answername": null,
        "mosha": null,
        "gjinia": null,
        "komuna": null,
        "emri": null,
        "email": null,
        "importanttopics": null,
        "selectedparties": null,
        "session": null
    }, {
        "id": 10,
        "questionnairename": null,
        "created_at": null,
        "updated_at": null,
        "questionnairecontent": null,
        "answername": null,
        "mosha": null,
        "gjinia": null,
        "komuna": null,
        "emri": null,
        "email": null,
        "importanttopics": null,
        "selectedparties": null,
        "session": null
    },

这是我的代码：

import { FlatList, StyleSheet, Text, View ,Button} from "react-native";

export default class App extends Component {
  state = {
    // data: [],
    text:"",
    questionnairename:""

  };

  postData=async()=>{
    let anketaData = new anketaData();
    anketaData.append("id","0");
    anketaData.append("questionnairename","ermira");

    this.setState({text:"ermira"})
    fetch("http://192.168.0.100:8000/anketa/testd?method=get",{
      method:"POST",
      body:anketaData
    }).then((response)=>response())
    .then((responseJson)=>{
      this.setState({text:JSON.stringify(responseJson)})
    })
  }

  render() {
    return (
      <View style={styles.container}>
        <Button onPress={this.postData} title="Post data"></Button>
        <Text>{this.state.text}</Text>
        <FlatList
          data={this.state.data}
          keyExtractor={(x, i) => i}
          renderItem={({ item }) =>
            <Text>
              {item.questionnairename} 
            </Text>}
        />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    marginTop: 15,
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
    backgroundColor: "#F5FCFF"
  }
});

这是错误：

“可能的未处理承诺拒绝 (id:0)”： TypeError: undefined is not a contructor(evalating "new anketaData()")

【问题讨论】：

什么是new anketaData()？
我在网上找到了这个something.append，你能帮我修改一下异步函数???
您需要发布对象吗？但是在你的代码中new anketaData() 有什么用呢？
我试图用新的 anketaData() 发布一个对象
你不能使用简单的对象

标签： reactjs react-native

【解决方案1】：

让 anketaData = new anketaData() 替换为

var formData = new FormData();

您也可以使用以下方法发布数据

fetch('https://mywebsite.com/endpoint/', {
  method: 'POST',
  headers: {
    Accept: 'application/json',
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    firstParam: 'yourValue',
    secondParam: 'yourOtherValue',
  }),
});

【讨论】：

state = { text:"", 问卷名称:"", id:"" }; postData=async()=>{ fetch('192.168.0.100:8000/api/anketa/testd', { method: 'POST', headers: { Accept: 'application/json', 'Content-Type': 'application/json', }, body: JSON.stringify({ firstParam: 'id', secondParam: '1700', }), }); }
render() { return ( {this. state.id} ）； } }
这是我现在的代码，我没有错误但仍然没有显示数据，状态是否正常并且渲染？

【解决方案2】：

method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({
mosha: TextInputName,
komuna: TextInputEmail,
emri: TextInputPhoneNumber
})
}).then((response) => response.json())
.then((responseJson) => {
Alert.alert(responseJson);
}).catch((error) => {
console.error(error);
});

【讨论】：