Recoil: first time with recoil any tip for access params

[hazem-a1]

TypeError: Object(...) is not a function

i get this error when am trying send params down

export const fetchjobs = selector({
key: "fetchjobs",
get: (counter) => async ({ get }) => {
try {
const response = axios(
"/jobs? _start= + counter + "&_limit=10"
);
const data = response.data;
return data;
} catch (error) {
console.log(error);
throw error;
}
},
});

i call it

const jobsDataFetched = useRecoilValueLoadable(waitForAll(fetchjobs(20)));

if (state === "hasValue") {
const { contents } = jobsDataFetched;
// console.log(contents);
return ;
}

what ever every thing works just fine if i called it with out any parameters

[acutmore]

Hi @hazem-a1

If you want to pass a parameter to a selector then you might be looking for selectorFamily.

export const fetchjobs = selectorFamily({
  key: "fetchjobs",
  get: (counter) => async ({ get }) => {
    try {
      const response = await axios(`/jobs? _start=${counter}&_limit=10`);
      const data = response.data;
      return data;
    } catch (error) {
      console.log(error);
      throw error;
    }
  },
});

...

const jobsDataFetched = useRecoilValueLoadable(fetchjobs(20)); // waitForAll not needed

[hazem-a1]

Hi @hazem-a1

If you want to pass a parameter to a selector then you might be looking for selectorFamily.

export const fetchjobs = selectorFamily({
  key: "fetchjobs",
  get: (counter) => async ({ get }) => {
    try {
      const response = await axios(`/jobs? _start=${counter}&_limit=10`);
      const data = response.data;
      return data;
    } catch (error) {
      console.log(error);
      throw error;
    }
  },
});

...

const jobsDataFetched = useRecoilValueLoadable(fetchjobs(20)); // waitForAll not needed

thanks but i already try selectorFamily

TypeError: Object(...) is not a function
Module../src/recoil/slectors.js
D:/dev/new-front-bob/job/src/recoil/slectors.js:4
1 | import axios from "axios";
2 | import { selector, selectorFamily } from "recoil";
3 |

4 | export const fetchjobs = selectorFamily({
5 | key: "fetchjobs",
6 | get: (counter) => async ({ get }) => {
7 | try {

i i keep see the same Error

[acutmore]

Hi @hazem-a1

Are you able to share a https://codesandbox.io link that recreates the issue, or perhaps a larger code sample?

[hazem-a1]

Hi @hazem-a1

Are you able to share a https://codesandbox.io link that recreates the issue, or perhaps a larger code sample?
SAND BOX
https://codesandbox.io/live/4xGV6J

[hazem-a1]

ok after changed the mock data api it works fine i can access the data from my component

i must done some thing wrong in my app i just will refactor it

thanks for help @acutmore