未捕获的TypeError:超级表达式必须为null或函数

时间:2018-01-18 15:53:22

标签: python reactjs ecmascript-6 react-redux redux-saga

所以我是React的新手,即使我发现其他多个人遇到同样的问题,我仍然没有在我的代码中找到错误。所以我转向你stackoverflow,你是我唯一的希望!

我正在学习,所以我想创建一个处理HTTP请求的简单ReactJS应用程序。完成代码后,我遇到了错误:

Uncaught TypeError: Super expression must either be null or a function, not object at exports.default (inherits.js?0578:21) at eval (app.js?71f7:22)

即使我尝试了很多不同的变化,但是我确信它与进口/出口有关,但是很多其他消息来源告诉我,虽然仔细检查进口等等,但错误仍然存​​在。得出任何结果。

代码:

app.js (处理简单按钮的呈现,并应在点击时执行简单的GET请求)

import React, { Component } from 'react'

import { connect } from 'react-redux' 
import { createServerSagaRequest } from '../saga/serverSaga'
import { incrRequestAmount, requestSelector } from '../reducer/requestReducer'


const mapStateToProps = (state) => {
  return {
    getRequestAmount: requestSelector.requests(state),
  }
}

const mapDispatchToProps = (dispatch) => {
  return {
    open: (url, data, action, method) => dispatch(createServerSagaRequest((url, data, action, method))),
    requests: () => dispatch(incrRequestAmount()),
  }
}


class App extends React {

  constructor(props){
    super(props)
  }

  _buttonClick() {
    this.props.requests()
    this.props.open("http://mvctestproject.local/GetData", "TestDataFraGet", action, "GET")  
  }

  render(){    
    return (
      <button
      className="btn btn-default"
      onClick={this._buttonClick()}>{this.props.getRequestAmount()}
      </button>
    )
  }
}

export default connect(mapStateToProps, mapDispatchToProps)(App)

serverSaga.js (我的传奇可以访问减速机和服务)

import React, { Component } from 'react'
import { put, call, take, fork, select } from 'redux-saga/effects'
import { callServer } from '../service/serverService'
import { incrRequestAmount, requestSelector } from '../reducer/requestReducer'

export function createServerSagaRequest() {return { type: CREATE_REQUEST }}


function* handleRequest(url, data, action, method, success){

  incrRequestAmount()

  return yield executeRequest(url, data, action, method, success)
}


function* executeRequest(url, data, action, method, success) {

    let response = yield call(callServer, url, method, data)
    let responseSuccess = response && response.Succeeded
    return 
}

export default function* serverSaga(){
  yield [
    fork(function*(){
      yield call (CREATE_REQUEST, handleRequest) 
    }),
  ]
}

rootSaga.js (分组传奇 - 如果我做得更多的话)

import { fork } from 'redux-saga/effects'

import serverSaga from './serverSaga'

export default function* rootSaga(){
  yield [
    fork(serverSaga)
  ]
}

requestReducer.js (唯一的功能是在每次请求后递增变量)

import { fromJS } from 'immutable'


export function incrRequestAmount() {return {type: 'INCR_REQUESTS'}}


const initialState = {
  requestAmount: 0
}

function requestReducer(state = fromJS(initialState), action){
  switch(action.type){
    case 'INCR_REQUESTS':
      return state.updateIn(["requestAmount"], (requests) => requests++)
    default:
      return state
  }
}

export const requestSelector = {
  amount: state => state.requests.get('requestAmount')
}

export default requestReducer

reducers.js (将缩减器分组 - 如果我做得更多)

import { combineReducers } from 'redux'
import React, { Component } from 'react'

import requests from './requestReducer'

export default combineReducers({
  requests,
})

serverService.js (处理对服务器的调用(GET / POST)

import React, { Component } from 'react'

export function callServer(url, bodyData, method){

  let methodType = method.toLowerCase()

  return new Promise((resolve, reject) => {
    let r;
    switch (methodType){
      case 'post':
        r = {
          method: 'POST',
          headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json',
          },
          body: JSON.stringify(bodyData)
        }
        break;
      case 'get':
        r = {
          method: 'GET'
        }
        break;
    }


    if (r) {

      console.log("URL: ", url)

      fetch(url, r)
        .then((response) => {
          console.log("Resp: ", url, response)
          return response.json()
        })


    }
  })
}

1 个答案:

答案 0 :(得分:2)

您需要扩展React以创建组件,而不是class App extends React { 本身:

class App extends React.Component {

应该是

Component

,或直接导入class App extends Component {

[Deployer\Exception\RuntimeException (-1)]                                                        
The command "if hash command 2>/dev/null; then echo 'true'; fi" failed.                           
Exit Code: -1 (Unknown error)                                                                     
Host Name: staging                                                                                
================                                                                                  
Warning: Identity file /home/user/.ssh/id_rsa not accessible: No such file or directory.  
Permission denied (publickey).