Question

我需要从对象室获取数据：{...}，但是我只能从控制台中的API记录整个数据。我需要协助.............................................. ................

这是我现在的代码：

class HomeScreen extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
         currentDate: new Date(),
         markedDate: moment(new Date()).format("YYYY-MM-DD"),
         isLoading: true,
         room: []
        };
    }


    componentDidMount() {
         fetch("https://URL/api/schedule?resolve[]=room", {method: "GET"})
        .then((response) => response.json())
        .then((responseJson) => {
           this.setState({room: responseJson});
           console.log(responseJson);
        })
        .catch((error) => {
            console.error(error);
        });
    }

    render() {
        const today = this.state.currentDate;
        const month = moment(today).format("MMMM");
        const date = moment(today).format("D")
        const day = moment(today).format("dddd");

       

        return (...)

这是JSON：

{
    "id": 190,
    "employee_id": 6,
    "room_id": 28,
    "type_of_cleaning": "D",
    "date": "2020-10-05",
    "room": {
        "data": {
            "id": 28,
            "customer_id": 5,
            "room_type_id": 19,
            "room_inventory_template_id": 8,
            "name": "154",
            "floor": 3
        }
    },
    "room-room_type": {
        "data": {
            "id": 19,
            "customer_id": 5,
            "name": "room_types_4451C9D4CD"
        }
    }
}

我需要显示房间的“名称”和“楼层”。

Answer 1

将房间的初始状态设置为空

   this.state = {
         currentDate: new Date(),
         markedDate: moment(new Date()).format("YYYY-MM-DD"),
         isLoading: true,
         room: null
        };

let roomName = ''
let roomFloor = '
if (this.state.room) {
  roomName = this.state.room.data.name
  roomFloor = this.state.room.data.floor
  }

Answer 2

您的room状态对象包含与JSON相同的数据。

您可以使用访问名称：this.state.room.room.data.name 下限：this.state.room.room.data.floor

然后您可以将其显示为 <Text>{this.state.room.room.data.name}</Text>和 <Text>{this.state.room.room.data.floor}</Text>

在访问数据时，请确保您的州房间对象中的数据结构相同，否则会导致错误

如何从React-Native中的API获取对象数据中的对象

2 个答案: