Question

我在上一个问题中问为什么我收到此“ map not a function”错误，而我明白这是因为在我更新应用程序中的数据后，response.message不再是数组格式了，映射所有数据的脚本出错，因为映射仅适用于数组。因此弄清楚为什么会发生错误是有帮助的，但是我似乎无法在代码中找到为什么更新后的数据不再采用数组格式的原因。所以我希望也许有人会看到我一直忽略的错误。在下面，我将代码片段放置在我认为可能发生错误的位置：

编辑数据脚本：

 export class VehicleEdit extends React.Component {
     constructor(props){
       super(props);

    const vehicleId = props.match.params.name;

    this.state ={
        vehicle: {}
    };

    getDetail(vehicleId).then((response) => {
        this.setState({
            vehicle: response.message,
        });
    });


}
updateManufacturer(manufacturer) {
    this.setState({
        vehicle: {
            ...this.state.vehicle,
            manufacturer,
        },
    });
}

updateModel(model) {
    this.setState({
        vehicle: {
            ...this.state.vehicle,
            model,
        },
    });
}
 onSubmit = (e) => {
    e.preventDefault();

    update(this.state.vehicle.name, this.state.vehicle).then((response) => {
        this.props.history.push('/vehicles');
    });
}
render() {
    return (

        <div>
        { (this.state.vehicle.name) ? (
            <form onSubmit={this.onSubmit}>
            <h1>{this.state.vehicle.name}</h1>
            <div>
            <label >Model: </label>
            <input type="text" name="model" id="model" value={this.state.vehicle.model} onChange={(e) => this.updateModel(e.target.value)} />
            </div>
            <div>
            <label >Manufacturer: </label>
            <input type="text" name="manufacturer" id="manufacturer" value={this.state.vehicle.manufacturer} onChange={(e) => this.updateManufacturer(e.target.value)} />
            </div> 
        ) : ( <p>Loading student details...</p>)}          
        </div>

    );
}
 }
 export default VehicleEdit;

我在我的应用程序vehicle.service.js中的更新

 export const update = (name, vehicle, vehicles) => fetch(`${url}/vehicles/${name}/edit`, { 
    method: 'PUT', 
    body: JSON.stringify(vehicle),
    mode: 'cors', 
    headers: new Headers({
        'Content-Type': 'application/json',
    })
}).then((response) => {
    if(response.statusText === 'OK') {
        return response.json();
    }
    throw new Error('Something went wrong UPDATING vehicle with name' + name);
});

以及我自己的api中的更新路线：

// UPDATE VEHICLE
app.put('/vehicles/:name/edit', (req, res) => {
    let vehicle = null;
    console.log('update vehicle', [req.body]);

    if (vehicles[0] && vehicles[0].length) {
        vehicle = vehicles[0].filter((vehicle) => ('' + vehicle.name) === req.params.name);
    }

    if (vehicle) {
        vehicles = vehicles[0].map((s) => {
            return ('' + s.name) === req.params.name ? vehicles.push[req.body] : s;
        })

        res.send({
            status: config.STATUS.OK,
            message: [req.body],
        });
    } else {
        res.send({
            status: config.STATUS.ERROR,
            message: 'Could not find vehicle for update',
        });
    }


});

对于超长的问题，我感到抱歉。只是因为我不知道我在哪里出错了。真希望有人看到我的错误。预先感谢

错误.map不起作用，数据不再是数组

0 个答案: