'How to pass value as prop from another file to function

I want to pass a value from file A to a function in file B that changes with slider input. I am trying to do this by passing the value as a prop.

I am currently getting the error "Expected 1 arguments, but got 0." when I call GraphArrayFunction() in file B because I am not passing a prop through the function. How would I pass a prop through the function if I want the prop to be able to be changed? File A:

const test = Number(rangeValue);
GraphArrayFunction({test});

File B:

interface MainProps {
    test: number
}

export const GraphArrayFunction = (props: MainProps) => {
    const {test} = props;
    let i = test 
    const j = 1;
    const graphArray = [];
    //let user change i
    if (i > 1) {
        while (j < i + 1){
            graphArray.push(randomNumber());
            j++;
        }
    }
    return graphArray;
}

const Graph = () => {
    return (
        <Wrapper>
            <GraphOutline>
                {GraphArrayFunction().map((numbers, index) => 
                <HeightBars height={numbers} />)}
            </GraphOutline>
        </Wrapper>
    )
}

export default Graph


Solution 1:[1]

File A:

const test = Number(rangeValue);
// Here you are passing {test} as an argument of function so it will work here.
GraphArrayFunction({test});

File B:

interface MainProps {
    test: number
}

export const GraphArrayFunction = (props) => {
    const {test} = props;
    let i = test 
    const j = 1;
    const graphArray = [];
    //let user change i
    if (i > 1) {
        while (j < i + 1){
            graphArray.push(randomNumber());
            j++;
        }
    }
    return graphArray;
}

// Error you are getting from this Graph function as you are calling above function here as well

const Graph = () => {
    return (
        <Wrapper>
            <GraphOutline>
// here you are not passing any argument. I have passes test:15 and your // function will use this. And that's why you are getting error that function // should have at least one argument 

                {GraphArrayFunction({test:15}).map((numbers, index) => 
                <HeightBars height={numbers} />)}
            </GraphOutline>
        </Wrapper>
    )
}

export default Graph

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Adesh Kumar