javascript 从connect(mapStateToProps)> UNDEFINED获取状态

6ju8rftf 于 2023-05-16 发布在 Java

关注(0)|答案(3)|浏览(99)

当我记录我得到的书的 prop 时，我有点挣扎着得到书的状态：undefined.
有什么建议吗？

import React from 'react';
import { connect } from 'react-redux';
import BookForm from './BookForm';

const EditBook = (props) => {
 console.log(props)
  return (
    <div>
      hello
    </div>
  );
};

const mapStateToProps = (state, props) => {
  return {
    book: state.books.find((book) => book.id === props.match.params.id)
  };
};

export default connect(mapStateToProps)(EditBook);

项目的其余部分在我的Github上：https://github.com/bananafreak/bookshelf

JavaScript

来源：https://stackoverflow.com/questions/50236533/getting-state-from-connectmapstatetoprops-undefined

3条答案

按热度按时间

huwehgph1#

更新BookListItem中的Link。${id}前面不需要**：**。* *：**导致问题。

<Link to={`/edit/${id}`}><h2>{title}</h2></Link>

在EditBook组件中，返回以下内容

<BookForm {...props}></BookForm>

在BookFormconstructor中，从props.book设置状态

this.state = { ...props.book }

赞(0）回复(0）举报 2023-05-16

hpcdzsge2#

我以前遇到过这样的问题，===会失败，因为book.id和props.match.params.id的类型不同。params的值总是字符串--可以尝试parseInt(props.match.params.id)或==比较（使用类型强制）。

赞(0）回复(0）举报 2023-05-16

gkl3eglg3#

我终于找到了我的错误所在。
在组件BookListItem中：

import React from 'react';
import { Link } from 'react-router-dom';

const BookListItem = ({ author, title, genre, text, id, pages }) => (
  <div>
    <Link to={`/edit/${id}`}><h2>{title}</h2></Link>
    <h3>by: {author}</h3>
    <p>{genre}</p>
    {pages > 0 && <p>{pages} pages</p>}
    <p>{text}</p>
    <p>-------------------------------</p>
  </div>
);

export default BookListItem;

在${id}之前，我有冒号{/edit/:${id}}，因此book.id和props.match.params.id无法匹配

赞(0）回复(0）举报 2023-05-16

我来回答

javascript 从connect(mapStateToProps)> UNDEFINED获取状态

3条答案

相关问题

热门标签

最新问答