小编lin*_*new的帖子

使用propTypes验证props会出现以下错误:

TypeError:无法读取未定义的属性"string".

TypeError:无法读取未定义的属性'func'.

有问题的代码位于代码段的底部:

import React from 'react';
import ProjectItem from './ProjectItem';

class Projects extends React.Component {

    deleteProject(title) {
      this.props.onDelete(title);
    }

    render() { 
      let projectItems;

      if (this.props.project) {
        projectItems = this.props.project.map(project => {
            return (
                <ProjectItem key={project.title} project={project} onDelete={this.deleteProject.bind(this)}  />
            )
        });
      }

      return (
        <div className="Projects">
          {projectItems}
        </div>    
      );    
    }

}

Projects.propTypes = {
  projects: React.PropTypes.string,
  onDelete: React.PropTypes.func
}

问题大纲

下面是调度错误/成功消息的标准方法,至少是教程推荐的内容:

{ type: 'FETCH_POSTS_FAILURE', error: 'Oops' }
{ type: 'FETCH_POSTS_SUCCESS', success: 'yay', response: { ... } }

{ type: 'FETCH_POSTS', status: 'error', error: 'Oops' }
{ type: 'FETCH_POSTS', status: 'success', response: { ... } }

但是,我遇到的问题是,这些错误/成功消息将显示在每个组件内部,监听正在处理这些操作的特定reducer.

示例场景:

图像你有一个todo应用程序有三个动作添加,编辑和删除,但所有这三个动作都是从UI的单独页面执行.它们都由相同的todo减速机处理.

此外,提供触发这些操作的UI的所有组件都通过mapStateToProps监听此todo reducer以接收待办事项更改(在此示例中不相关)以及成功和错误消息:

function mapStateToProps(state) {
    return { 
        success: state.todo.success,
        error: state.todo.error,
    }; 
}

{!!this.props.success …

我有一个干净的create-react-app安装,我想添加自己的svg图像来显示,就像显示徽标一样,即:

import logo from './logo.svg';

{logo}

然而,当我导入自己的svg时,与导入徽标的方式相同并尝试使用它,它会在屏幕上打印这样的URL:

 /static/media/menu.92677579.svg 

相反或渲染图像,有人可以帮我解决这个问题吗？

我想使用setInterval每小时,每小时调用一次API,我将如何实现它？

componentDidMount() {
  fetch(fullURL)
    .then((response) => response.json())
    .then((responseJson) => {
      // console.log(responseJson);
      const resultyt = responseJson.items.map(obj => "https://www.youtube.com/embed/" + obj.id.videoId);
      this.setState({resultyt});
    })
    .catch((error) => {
      console.error(error);
    });
}

API调用存储在名为fullURL的const中

下面，从我所看到的，是一个非常标准的 reducer 签名，用于处理基于令牌的身份验证：

function auth(state = {
    isFetching: false,
    isAuthenticated: localStorage.getItem('id_token') ? true : false
  }, action)

该isAuthenticated属性根据 localStorage 中是否存在令牌来检查用户是否登录，如果我使用带有 cookie 的会话身份验证，我将如何做同样的事情？

编写一个函数来根据其名称从 document.cookie 中检索 cookie 并以与上面的示例代码完全相同的方式使用它是否就足够了？

谢谢