I need help in understanding this piece of code. What is it doing and what is the type its returning. Possibly break it in smaller chunks to understand.
Why would it join array elements on '.' and then split them using the same dilimentor'.' What type of array is being passed back from search results?
function getRandomInt(max, min = 0) {
return Math.floor(Math.random() * (max - min + 1)) + min; // eslint-disable-line no-mixed-operators
}
const searchResult = query =>
new Array(getRandomInt(5))
.join('.')
.split('.')
.map((item, idx) => {
const category = `${query}${idx}`;
return {
value: category,
label: (
<div
style={{
display: 'flex',
justifyContent: 'space-between',
}}
>
<span>
Found {query} on{' '}
<a
href={`https://s.taobao.com/search?q=${query}`}
target="_blank"
rel="noopener noreferrer"
>
{category}
</a>
</span>
<span>{getRandomInt(200, 100)} results</span>
</div>
),
};
});
its been called like this
const [options, setOptions] = useState<SelectProps<unknown>["options"]>([]);
const handleSearch = (value: string) => {
setOptions(value ? searchResult(value) : []);
};
I want to be able to put console.log to see what value is setOptions getting. Thanks
----------------- Update 2-----------------
const searchResult = (query: string) => {
const myArray = new Array(getRandomInt(5)).fill(0).map((item, idx) => {
const category = `${query}${idx}`;
return {
value: category,
label: labelElement(query, category),
};
});
console.log(myArray);
return myArray;
};
const labelElement = (query: string, category: string) => {
return (
<div
style={{
display: "flex",
justifyContent: "space-between",
}}
>
<span>
Found {query} on <a>{category}</a>
</span>
<span>{getRandomInt(200, 100)} results</span>
</div>
);
};
const [options, setOptions] = useState<SelectProps<unknown>["options"]>([]);
const handleSearch = (value: string) => {
setOptions(value ? searchResult(value) : []);
};