修复React TS2322报错：()=>boolean类型无法赋值给ReactNode

JSX的插值语法{}中只接受合法的ReactNode类型值，包括字符串、数字、布尔值、null、undefined、合法JSX元素、上述类型构成的数组。
你的代码中{results}传入的是results函数本身的引用，类型为() => boolean，不属于可渲染的ReactNode范畴，因此触发ts(2322)类型报错。
额外注意，你写的回文判断逻辑本身还有隐藏bug：数组的join()方法不传参数时默认用逗号作为分隔符拼接，反转后的数组拼接结果会多出逗号，会导致回文判断结果错误。

需要做两处修改：

• 在插值位置调用results函数，拿到实际的布尔类型返回值再渲染，布尔值是合法的ReactNode类型
• 给join()方法传入空字符串作为分隔符，修正回文判断逻辑

修复后的完整代码：

export const Palindrome:React.FC<{}> = () => {
    const results = ():boolean => {
        const int = 121;
        return String(int) === String(int).split('').reverse().join('');
    };

    return (
        <div>
            {results()}
        </div>
    )
}

如果不想每次组件渲染都重复执行计算，也可以用useMemo缓存计算结果，写法如下：

import { useMemo } from 'react';

export const Palindrome:React.FC<{}> = () => {
    const result = useMemo(() => {
        const int = 121;
        return String(int) === String(int).split('').reverse().join('');
    }, []);

    return (
        <div>
            {result}
        </div>
    )
}

内容的提问来源于stack exchange，提问作者Temisan Momodu