React+Chakra报错：勿将children作为props传递，需嵌套在开闭标签内如何解决

Chakra UI 的InputLeftElement组件禁止显式通过children属性传递子元素，错误提示已经明确要求将子内容嵌套在组件的开标签和闭标签之间。

<Stack id='phone'>
  <InputGroup>
    <InputLeftElement pointerEvents='none'>
      <PhoneIcon color='gray.300' />
    </InputLeftElement>
    <Input
      type='tel'
      name={`${type}[phone]`}
      autoComplete='phone'
      value={Phone}
      placeholder='Numero de telephone'
      className='chakra-input'
    />
  </InputGroup>
</Stack>

• 这是Chakra UI的通用语法规范，不止InputLeftElement，同系列的InputRightElement等组件都遵循同样的写法要求
• React中children本身是内置特殊属性，嵌套写法是React传递子元素的标准方式，仅少数特殊场景会用到显式传children prop的写法，遇到组件库的相关限制后按要求调整写法即可

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