README
aria-fritta-native-plugins-reducers
install
- create routes.js file into plugin/ folder in aria-fritta-native, example:
export default [
{
id: "example",
url: "url",
method: "put",
queryParams: ["varQuery1"],
bodyParams: ["varBody1", "varBody2"],
restParams: [
{ type: "constant", value: "id" },
{ type: "parameter", value: "user_id" },
{ type: "constant", value: "range" },
{ type: "parameter", value: "range_value" }
], // rest params verrano fuori cosi: /id/{user_id}/range/{range_value}
showLog: true,
tokenRequired: true
}
/*
example
{
id: 'example',
url: `${config.server.http.url}`,
method: 'put',
queryParams: ['km'],
bodyParams: ['id', 'name'],
restParams: [
{ type: 'constant', value: 'user' },
{ type: 'parameter', value: 'user_id' },
{ type: 'constant', value: 'award' },
{ type: 'parameter', value: 'award_id' }
],
showLog: true,
tokenRequired: true
}
*/
];
- import this plugin in aria-fritta-native
- add the following code into plugin/index.js in aria-fritta-native
import reducers from "aria-fritta-native-plugins-reducers";
- add into export object: reducers
for example:
export { reducers, ... };
- add into export default object: reducers
for example:
export default Object.values({
reducers,
...
});
Note
tutto le cose che sono sotto <# #> devi metterci un valore
Redux
esempio del reducers menu che c'รจ di base configurato
...
import { actions, mapSelectorToProps } from 'reducers';
...
render() {
const { menuOpened } = this.props;
const { store } = this.context;
return (
<div>
<Drawer
open={menuOpened}
onClose={() => {
store.dispatch(actions.hideMenu());
}}
>
...
</Drawer>
</div>
);
}
...
export default mapSelectorToProps(<#NomeComponente#>, ['menuOpened']);
Redux Saga
Imposta la chiamata
andare dentro src/reducers/http-request/constants.js:
- aggiungere dentro actionsData un altro oggetto con le caratteristiche della chiamata:
{
id: 'example',
url: 'url',
method: 'put',
queryParams: ['varQuery1'],
bodyParams: ['varBody1', 'varBody2'],
restParams: [
{ type: 'constant', value: 'id' },
{ type: 'parameter', value: 'user_id' },
{ type: 'constant', value: 'range' },
{ type: 'parameter', value: 'range_value' }
], // rest params verrano fuori cosi: /id/{user_id}/range/{range_value}
showLog: true,
tokenRequired: true
}
Adesso vai nel componente in cui devi implementare la chiamata e importa questi seguenti file:
import { mapHttpToProps, actions } from "reducers";
e alla fine del file aggiungere questi seguenti cose:
export default mapHttpToProps(<#NomeComponente#>, [ '<#id che hai messo nell'elemento dentro l'array manageHttpReducer nella classe constant#>' ]);
Esegui la chiamta
vai nel pezzo di codice dove vuoi eseguire la chiamata:
const { store } = this.context;
store.dispatch(actions.<#id che hai messo nell'elemento dentro l'array manageHttpReducer nella classe constant#>({
// inserisci i params che avevi messo nella costants, nell'esempio che ti ho fatto sono:
varQuery1: "value 1",
varBody1: "value 2",
varBody2: "value 3",
user_id: 102,
range_value: "0-10"
}, {
then: (result) => {
// viene richiamta questa callback quando finisce di eseguire la chiamata, puoi anche non mettercela
},
catch: (error) => {
// viene richiamta questa callback se la chiamata va in errore, puoi anche non mettercela
}
}));
Access to RefComponent
this._ref.getWrappedInstance().someFunction();
with Mobx and Reducer
this._ref.getWrappedInstance().wrappedInstance.someFunction();