javascript - 组件 react 中的传播运算符

标签 javascript reactjs

<分区>

在以下上下文中使用展开运算符时,我无法理解展开运算符:

const renderField = ({input, label, type, meta: {touched, error, warning}}) => (
  <div>
    <label>{label}</label>
    <div>
      <input {...input} placeholder={label} type={type} />
      {touched &&
        ((error && <span>{error}</span>) ||
          (warning && <span>{warning}</span>))}
    </div>
  </div>
)

在这种情况下,它是否获取所有 Prop 并将它们设置为输入。propname

最佳答案

是的!当您展开 input 时,您的组件会自动获取其属性。

假设您的输入是:

const input = {
  type: 'text',
  value: 'new value',
  placeholder: 'Type anything'
}

传播后,您的渲染组件将是:

<input type="text" placeholder="Type anything" value="new value" />

关于javascript - 组件 react 中的传播运算符,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46113316/

相关文章:

javascript - 禁用点击事件处理程序

php - 在reactJS中如何避免使用表单返回空数据?还要检查后端代码,专家给我答案

node.js - 从服务器提供静态 React 应用程序,刷新时崩溃

带有折叠按钮的 JavaScript 复选框

javascript - jQuery on(change) 第二次不起作用

javascript - 如何仅禁用上个月的日期

javascript - React + Firebase取消订阅不是useEffect中的函数

javascript - TypeError : t(. ..).on 不是 fullcalendar 上的函数

reactjs - Firebase 身份验证状态在客户端上保留,但在硬刷新时不保留

javascript - React fetch Firebase 获取唯一键值