我自己在一个项目中工作,我正在使用Reactjs和Nodejs。
我完成了Nodejs部分,我已经拥有了数据库中需要的数据,我已经将它转换为json,我准备将这些数据发送到前端。
我所做的只是excludedWords.contains(word) == true
请求,前端的主要工具是axios。此GET
请求是为了显示赌场游戏的简单经销商列表。
我需要的是一段简短的代码和解释,以便了解我在做什么。我一直在阅读所有信息,但对我来说并不容易,因为我觉得无法将文档中的示例改编为我的代码,抱歉,我只是一名初级开发人员。
这基本上是服务部分
GET
现在,我需要知道的是:我应该在import axios from 'axios';
const API_ENDPOINT = `${API_URL}/services`;
const GetDealers = {
axios.get(`${API_ENDPOINT}/get-dealers/get-dealers`)
.then(function(response) {
console.log('get-dealers', response);
})
};
export default GetDealers;
和actions
部分做些什么?
这就是我真正想弄清楚的。在知道如何处理stores
和Actions
之后,我应该调用Stores
还是action
?
Angular对我来说很容易学习,但似乎React适用于拥有至少2年JavaScript经验的人。我很难得到它。
答案 0 :(得分:2)
我会更多地研究Flux架构。
基本上,您希望在代码的“then”部分执行的操作是向商店发送操作,有关调度程序的更多信息here。
我经常使用的调度员调用示例如下:
Dispatcher.handleViewAction({
actionType: ActionConstants.RECEIVE_STORES,
stores: stores
});
当您的调度员处理上述操作时,它会将其发送到已注册调度员以处理有效负载的每个商店。其中有一个switch语句来处理相关数据。
DirectoryStore.dispatchToken = Dispatcher.register(function(payload) {
let action = payload.action;
console.log(action)
switch (action.actionType) {
case "RECEIVE_STORES":
setDirectoryStores(action.stores);
break;
case "FILTER_STORES":
filterDirectoryStores(action);
break;
default:
return true;
break;
}
DirectoryStore.emitChange();
return true;
});
一旦它通过了switch语句,你就可以发出一个事件 在您的商店内部,由视图收听。
商店:
emitChange() {
this.emit('change');
},
addChangeListener(callback) {
this.on('change', callback);
},
removeChangeListener(callback) {
this.removeListener('change', callback);
},
getDirectoryStores() {
return {"data" : _directoryData};
}
查看:
componentWillMount() {
DirectoryStore.addChangeListener(this._onChange);
},
componentDidMount(){
StoreActionCreator.getDirectoryStores();
},
componentWillUnmount() {
DirectoryStore.removeChangeListener(this._onChange);
},
_onChange() {
let data = DirectoryStore.getDirectoryStores();
this.setState({
data: data.data
});
}