【发布时间】: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