我如何将属性直接传递给 vuejs 中的组件，例如 reactjs

【问题标题】：How I can pass attributes directly to component in vuejs, like reactjs我如何将属性直接传递给 vuejs 中的组件，例如 reactjs
【发布时间】：2020-09-30 14:04:00
【问题描述】：

这是 react.js 中的示例：

Form.jsx

<FormInput
 type='text'
 name='displayName'
 value={displayName}
 onChange={this.handleChange}
 required
/>

Input.jsx

const FormInput = ({ handleChange, ...otherProps }) => (
    <input className="form-input" onChange={handleChange} {...otherProps} />
)

我的问题是，我怎样才能将属性传递给具有扩展对象的其他组件？比如 react.js

【问题讨论】：

标签： javascript reactjs vue.js components

【解决方案1】：

请参阅文档的this 页面。通过使用v-bind 绑定一个对象（没有扩展运算符），Vue.js 内部将提取每个属性并将它们作为单独的道具传递。在上面的示例中，您将执行以下操作：

<form-input
    type="text"
    name="displayName"
    required
    v-bind="otherProps"
    v-on:change="handleChange"
></form-input>

执行上述操作与手动将所有道具一个接一个地传递是一样的：

<form-input
    type="text"
    name="displayName"
    required
    v-bind:prop1="otherProps.prop1"
    v-bind:prop2="otherProps.prop2"
    v-bind:prop3="otherProps.prop3"
    ... etc ...
    v-on:change="handleChange"
></form-input>

【讨论】：