小编gil*_*esh的帖子

React - Redux App:"无效尝试传播非可迭代实例"问题

一开始,该示例应用程序正常运行.我可以看到我通过浏览器页面和数据库输入的数据.现在,我只能通过数据库看到数据,浏览器不显示数据并另外收到此错误:"无效尝试传播非可迭代实例".

有示例代码:

projectActions.js

import {FETCH_BOOK, CREATE_BOOK, DELETE_BOOK} from '../actions/projectTypes';
import axios from 'axios';

const apiUrl = 'http://api/books';

export const createBookSuccess =  (data) => {
  return {
    type: CREATE_BOOK,
    payload: {
      _id: data._id,
      author: data.author,
      publication: data.publication,
      publisher: data.publisher
    }
  }
};

export const deleteBookSuccess = _id => {
  return {
    type: DELETE_BOOK,
    payload: {
      _id
    }
  }
};

export const fetchBook = (books) => {
  return {
    type: FETCH_BOOK,
    books
  }
};

export const createBook = ({ author, publication, publisher …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs react-redux

16
推荐指数
3
解决办法
4万
查看次数

React:将 event.preventDefault() 方法添加到功能组件中

目前,我试图通过向功能组件(在 bookList.js 中定义)preventDefault()onClick处理程序中添加调用来避免刷新页面BookList。我知道我可以从类组件到功能性。但是,有什么方法可以调用preventDefault()中的onClick事件处理程序BookList吗?

这是我的示例代码:

BookListElement.js

import React from 'react';
import { connect } from 'react-redux';
import BookList from '../components/bookList';
import { deleteBook } from '../store/actions/projectActions';

const BookListElement = ({books, deleteBook}) => {
  if(!books.length) {
    return (
      <div>
        No Books
      </div>
    )
  }
  return (
    <div>
      {Array.isArray(books) ? books.map(book => {
        return (
          <BookList book={book} deleteBook={deleteBook} key={book._id} />
        );
      }): <h1>something wrong.</h1>}
    </div>
  );
};

const mapStateToProps = state …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs

1
推荐指数
1
解决办法
7398
查看次数

标签 统计

javascript ×2

reactjs ×2

react-redux ×1