前端 - React中我们传Props的参数是否可用props方式，也可用slot方式？

Question

有一段示例代码：

import React from 'react'

interface FormProps<T> {
  values: T,
  children: (values: T) => React.ReactElement
}

const Form = <T extends {}>({values, children}: FormProps<T>) => {
  return children(values)
}

const App: React.FC = () => {
  return (
    <div className='App'>
      <Form <{lastName: string | null}> values = {{ lastName: "leo" }}>
        {values => <div>{values.lastName}</div>}
      </Form>
    </div>
  )
}

export default App 

请问一下
1、Form这个组件：
定义：

interface FormProps<T> {
  values: T,
  children: (values: T) => React.ReactElement
}

const Form = <T extends {}>({values, children}: FormProps<T>) => {
  return children(values)
}

使用：

<Form <{lastName: string | null}> values = {{ lastName: "leo" }}>
    {values => <div>{values.lastName}</div>}
</Form>

请问下：
1）我们传Props的参数是否可用props方式，也可用slot方式？
是否Props的children参数，只能用slot的方式传递？
2）一般约定俗成而言，children都是传递<xxx>子组件是吗？

Answer 1

React 里哪来的 slot？你这是跟 Vue 弄混了？

React 里实现类似的功能是通过 props.children 的。

---

难不成你管 JSX 里这部分叫 Slot 了？

Answer 2

1."slot"这个在React里用的不是很多，更多的是在Vue里用，React用Props传数据，函数、组件之类的，Props的children参数也是Props，Props里的子元素
2.对的，这样父组件可以灵活的控制子组件