【问题标题】:React-router TypeError: _NavbarActions2.default.updateOnlineUsers is not a functionReact-router TypeError: _NavbarActions2.default.updateOnlineUsers 不是函数
【发布时间】:2016-05-20 15:59:18
【问题描述】:

我正在使用 nodeJs 和 react 0.14.2 与 react-router 1.0.3 和历史 1.17.0。当我在我的应用程序上导航时,无论我尝试执行什么操作,我都会得到“未定义”,例如从数据库中获取一个字符

import alt from '../alt';
import {assign} from 'underscore';

class NavbarActions {
 constructor() {
 this.actions = alt.generateActions(
  'updateOnlineUsers',
  'updateAjaxAnimation',
  'updateSearchQuery',
  'getCharacterCountSuccess',
  'getCharacterCountFail',
  'findCharacterSuccess',
  'findCharacterFail'
 );
 this.findCharacter = this.findCharacter.bind(this);
}

findCharacter(payload) {
$.ajax({
  url: '/api/characters/search',
  data: { name: payload.searchQuery }
})
  .done((data) => {
    assign(payload, data);
    self.actions.findCharacterSuccess(payload);
  })
  .fail(() => {
    self.actions.findCharacterFail(payload);
  });
 }

 getCharacterCount() {
  $.ajax({ url: '/api/characters/count' })
  .done((data) => {
    self.actions.getCharacterCountSuccess(data)
  })
  .fail((jqXhr) => {
    self.actions.getCharacterCountFail(jqXhr)
  });
 }
}

export default alt.createActions(NavbarActions);

我在调试时遇到错误,无法再在搜索栏中输入

TypeError: _NavbarActions2.default.updateOnlineUsers is not a function

但是,当我调试时,我看到我得到一个带有我的数据的 json 字符串,并且有效负载对象不为空并且有数据。

从 Navbar.js 调用 NavbarActions

import React from 'react';
import {Link} from 'react-router';
import NavbarStore from '../stores/NavbarStore';
import NavbarActions from '../actions/NavbarActions';

class Navbar extends React.Component {
 constructor(props) {
  super(props);
  this.state = NavbarStore.getState();
  this.onChange = this.onChange.bind(this);
}

componentDidMount() {
 NavbarStore.listen(this.onChange);
 NavbarActions.getCharacterCount();

 let socket = io.connect();

 socket.on('onlineUsers', (data) => {
   NavbarActions.updateOnlineUsers(data);
 });

 $(document).ajaxStart(() => {
   NavbarActions.updateAjaxAnimation('fadeIn');
 });

 $(document).ajaxComplete(() => {
  setTimeout(() => {
    NavbarActions.updateAjaxAnimation('fadeOut');
  }, 750);
 });
}
componentWillUnmount() {
 NavbarStore.unlisten(this.onChange);
}

onChange(state) {
 this.setState(state);
}

handleSubmit(event) {
event.preventDefault();

let searchQuery = this.state.searchQuery.trim();

if (searchQuery) {
  NavbarActions.findCharacter({
    searchQuery: searchQuery,
    searchForm: this.refs.searchForm,
    history: this.props.history
  });
}

}

【问题讨论】:

  • 您的 generateActions 方法是在哪里定义的?您也可以发布一些有关此的详细信息吗?
  • generationActions 只是此链接alt.js.org/docs/createActions 中的简写

标签: jquery json node.js reactjs react-router


【解决方案1】:

存在一些与范围相关的基本问题,我希望这应该可行。

    import alt from '../alt';
    import {assign} from 'underscore';

    class NavbarActions {
      constructor() {
       this.generateActions(
       'updateOnlineUsers',
       'updateAjaxAnimation',
       'updateSearchQuery',
       'getCharacterCountSuccess',
       'getCharacterCountFail',
       'findCharacterSuccess',
       'findCharacterFail'
     );
     this.findCharacter = this.findCharacter.bind(this);
    }

    findCharacter(payload) {
    var self = this;
    $.ajax({
      url: '/api/characters/search',
      data: { name: payload.searchQuery }
    })
      .done((data) => {
        assign(payload, data);
        self.actions.findCharacterSuccess(payload);
      })
      .fail(() => {
        self.actions.findCharacterFail(payload);
      });
    }
    export default alt.createActions(NavbarActions);

【讨论】:

  • Tkx 但不幸的是它在这部分代码'socket.on('onlineUsers', (data) => { NavbarActions.updateOnlineUsers(data); });'上给了我一个不同的错误错误:'TypeError:_NavbarActions2.default.updateOnlineUsers 不是函数'
【解决方案2】:

通过创建一个新的项目文件夹并重新运行一个干净的 npm 安装来解决。我认为我的依赖项有问题

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2022-06-29
    • 1970-01-01
    • 2020-08-18
    • 2020-08-25
    • 1970-01-01
    • 2015-12-17
    • 2018-05-01
    • 2021-05-01
    相关资源
    最近更新 更多