javascript - 如何 post props redux React

标签 javascript reactjs axios fetch

我想解释一下我今天遇到的问题。

我无法发布“this.props.total”, 我不明白如何发布 Prop ,你能帮我吗? 目前 Prop 工作正常。

import React, { Component } from 'react';
import { CardText, } from 'reactstrap';
import { connect } from 'react-redux'

class thisPropsFortotal extends Component {

handleSubmit = (e) => {
    e.preventDefault();
    const config = {
     method: "POST",
     headers: {
       "Content-Type": "application/json",
     },
     body: JSON.stringify({this.props.total}),
    };

     const url = entrypoint + "/alluserpls";
     fetch(url, config)
     .then(res => res.json())
     .then(res => {
       if (res.error) {
         alert(res.error);
       } else {
         alert(`ajouté avec l'ID ${res}!`);
       }
     }).catch(e => {
       console.error(e);

       }).finally(() => this.setState({ redirect: true }));
    }
   render() {
    return (
        <div>
            <form onSubmit={this.handleSubmit}>
  <button type="submit">Add</button>
  </form>
            <CardText>{this.props.total} € </CardText>
        </div>
    );
   }
 }
 const mapStateToProps = (state) => {
  return {
    total: state.addedItems.reduce((acc, item) => { return acc + (item.quantity * 
  item.price) }, 0)
    //addedItems: state.addedItems
  }
  }

export default connect(mapStateToProps)(thisPropsFortotal)

您知道如何解决这个问题吗?内夫

最佳答案

您正在尝试对 {this.props.total} 进行字符串化,这是无效的语法。

您可以传递一个显式定义 total 属性的对象,如下所示:

body: JSON.stringify({total: this.props.total}),

或者,简单地字符串化 this.props 对象本身:

body: JSON.stringify(this.props),

关于javascript - 如何 post props redux React,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60322778/

相关文章:

进度条原型(prototype)中的 JavaScript 事件处理程序出现未定义的值

javascript - JSPlumb v1.4.1 可拖动/可调整大小的示例不再适用于 v2.0.7

javascript - 报错: webpack. optimize.CommonsChunkPlugin已被移除,请改用config.optimization.splitChunks

javascript - 在 React 组件中使用的字符串变量中插入 html

javascript - 用 Jest 模拟 axios 会引发错误 “Cannot read property ' 未定义的拦截器”

javascript - 为什么这些 Jest 不会重置?

javascript - JS 新对象 VS 新对象()

reactjs - Azure 应用服务上符号链接(symbolic link)上的 yarn EPERM(不允许操作)

javascript - 如何在Vue-router中使用$router.push?

javascript - 当尝试访问路由参数时,我只获取其中的一部分,并且 # 之后的所有内容都被切断