我收到了错误消息：

Uncaught TypeError: Cannot read property ‘setState’ of null

这是组件代码清单：

class MessageList extends React.Component {
 constructor(props){
 super(props);
 this.state = {
   messages: []
 };

 var firebaseRef = firebase.database().ref();
 firebaseRef.once('value')
  .then(function(dataSnapshot) {
      this.setState({
        messages: messages
      });
   });
 }

 render() { ... }

}

var firebaseRef = firebase.database().ref();
firebaseRef.once('value')
  .then((dataSnapshot) => {
      this.setState({
        messages: messages
      });
   });

或者在承诺之前创建一个这样的副本

constructor(props){
 super(props);
 this.state = {
   messages: []
 };
 var that = this; 
 var firebaseRef = firebase.database().ref();
 firebaseRef.once('value')
  .then(function(dataSnapshot) {
      that.setState({
        messages: messages
      });
 });

最后一个选项,您可以将此绑定到承诺：

firebaseRef.once('value')
 .then(function(dataSnapshot) {
     this.setState({
         messages: messages
     });
}).bind(this)

import React from "react";

class StateBasic extends React.Component{

    constructor(){
        super();
        let personProfile =  this.state = {
                name : "Bob",skill : "Art Designer",location : "LA"
        }
        console.log(personProfile);        
    }

    render(){
        let changeName =  this.setState({ name : "Frank" });

        return(
            <div className="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">   
                <ul>
                    <li> {this.state.name} </li>
                    <li> {this.state.skill} </li>
                    <li> {this.state.location} </li>
                    <li> {changeName} </li>
                </ul>
            </div>
        );
    }
}

// Let's render ReactDOM
export default StateBasic;

解决方法

class StateBasic extends React.Component {
  constructor() {
    super();
    let personProfile = this.state = {
      name: "Bob",skill: "Art Designer",location: "LA"
    }
  }

  componentDidMount() {
    setTimeout(() => {
      this.setState({name: "Frank"});
    },1000)
  }

  render() {
    return ( 
      <div className="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
        <ul>
          <li> {this.state.name} </li>
          <li> {this.state.skill} </li>
          <li> {this.state.location} </li>
        </ul>
      </div>
    );
  }
}

ReactDOM.render( <
  StateBasic / >,document.getElementById('container')
)

<script src="https://unpkg.com/react@16.0.0/umd/react.development.js"></script>
<div id="container"></div>
<script src="https://unpkg.com/react-dom@16.0.0/umd/react-dom.development.js"></script>

当我从firebase配置对象调用firestore时.

它说

firebase2.default.firestore is not a function

这是代码

import firebase from 'firebase'

const config = {
  apiKey: "AIzaSxxxxxxqpUeqKXI",authDomain: "payxxxxxa1.firebaseapp.com",databaseURL: "https://payxxxxxxxa1.firebaseio.com",projectId: "payxxxxxxja1",storageBucket: "payxxxxxa1.appspot.com",messagingSenderId: "281xxxxxxxx576"
}

firebase.initializeApp(config)

export const fire = firebase
export const ref = firebase.database().ref()
export const firebaseAuth = firebase.auth
export const messaging = firebase.messaging();
export const db = firebase.firestore();

Firebase版本是4.5.0

npm list firebase > firebase@4.5.0

我做错了吗？

import’@ firebase / firestore’

参考：https://www.npmjs.com/package/@firebase/firestore

问题

运行我的jests测试会出现以下错误

● Test suite Failed to run

    Cannot find module 'react/lib/React' from 'ReactShalloWrenderer.js'

      at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:191:17)
      at Object.<anonymous> (node_modules/react-test-renderer/lib/shallow/ReactShalloWrenderer.js:16:13)

我是如何升级的

第1步：yarn.lock

在rebase期间,使用React v16进入分支 – 我在我的yarn.lock文件上放了yarn 1.1.0 take care of merge conflicts

第2步：添加适配器

我添加了新的适配器setupTestFramework.js

import { configure } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
configure({ adapter: new Adapter() });

第3步：升级包

并升级了以下套餐：

react "16.0.0",enzyme "3.1.0",jest "21.2.1",babel-jest "21.2.0",

谁能看到我错过的任何东西？