如何从 this.state 中获取价值.未定义的属性 [英] How to get value from this.state. Property of undefined

问题描述

我正在尝试将值从一个组件传递到另一个组件.第一个看起来像这样:

class ListStation 扩展组件 {构造函数(道具){超级(道具)this.state = {车站:[]}this.editStation = this.editStation.bind(this);}编辑站(ID){this.props.history.push(`/add-station/${id}`);}componentDidMount() {StationService.getStations().then((res) => {this.setState({ 站: res.data });})}}使成为() {返回 (<div>{this.state.stations.map(车站 =><tr key={station.id}><td>{station.city}</td><td>{station.name}</td><td><button onClick={() =>this.editStation(station.id)} className=btn btn-info">Modify</button>...

);}}导出默认 ListStation；

另一个看起来像这样:

import React, { Component } from 'react';从../services/StationService"导入 StationService；类 CreateStationComponent 扩展组件 {构造函数(道具){超级(道具)this.state = {车站: {id: this.props.match.params.id,城市: ''，姓名: ''，火车:[{数字: ''，numberOfCarriages: ''}]}}this.changeCityHandles = this.changeCityHandles.bind(this);this.changeNameHandles = this.changeNameHandles.bind(this);this.saveStation = this.saveStation.bind(this);}componentDidMount() {如果 (this.state.station[0].id === '_add') {返回;} 别的 {StationService.getStationById(this.state.id).then((res) => {让站 = res.data;this.setState({ name: station[0].name, city: station[0].city })});}console.log(this.state.station.city + 'dfddddd');}

但是当我尝试将值从一个组件传递到另一个组件时，出现错误:未定义的属性.我从 API 得到的响应如下所示:

我正在尝试根据从第一个组件中获取的 id 来编辑值，但似乎失败了.

解决方案

if (this.state.station[0].id === '_add') {返回;}

看看你的代码库中的 if 语句我认为你应该在 this.state.station 之后删除 [0] ...这是因为 station 是一个对象而不是一个数组

I'm trying to pass value from one component to another. First one looks like this:

class ListStation extends Component {
    constructor(props) {
        super(props)

        this.state = {
            stations: []
        }

        this.editStation = this.editStation.bind(this);
    }


    editStation(id) {
        this.props.history.push(`/add-station/${id}`);
    }

    componentDidMount() {
        StationService.getStations().then((res) => {
            this.setState({ stations: res.data });
        })
    }

    }

    render() {
        return (
            <div>

                        <tbody>
                            {this.state.stations.map(
                                station =>
                                    <tr key={station.id}>
                                        <td>{station.city}</td>
                                        <td>{station.name}</td>
                                        <td>
                                            <button onClick={() => this.editStation(station.id)} className="btn btn-info">Modify</button>
                          ...                  
                </div>
            </div>
        );
    }
}

export default ListStation;

And another looks like this:

import React, { Component } from 'react';
import StationService from '../services/StationService';

class CreateStationComponent extends Component {
    constructor(props) {
        super(props)

        this.state = {
            station: {
                id: this.props.match.params.id,
                city: '',
                name: '',
                trains: [
                    {
                        number: '',
                        numberOfCarriages: ''
                    }
                ]
            }
        }

        this.changeCityHandles = this.changeCityHandles.bind(this);
        this.changeNameHandles = this.changeNameHandles.bind(this);
        this.saveStation = this.saveStation.bind(this);
    }

    componentDidMount() {

        if (this.state.station[0].id === '_add') {
            return;
        } else {
            StationService.getStationById(this.state.id).then((res) => {
                let station = res.data;
                this.setState({ name: station[0].name, city: station[0].city })
            });
        }
        console.log(this.state.station.city + 'dfddddd');
    }

But when I try to pass value from one component to another I get error: Property of undefined. The response I get from API looks like this:

I'm trying to edit values based on the id taken from the first component but it seems to fail.

解决方案

if (this.state.station[0].id === '_add') {
        return;
    } 

Have a look at this if statement from your codebase I think you should remove [0] after this.state.station ... this is because station is an object not an Array

这篇关于如何从 this.state 中获取价值.未定义的属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！