从包装React组件传入material-component的TextField属性,可以通过以下步骤实现:
import React from 'react';
import TextField from '@material-ui/core/TextField';
class MyTextField extends React.Component {
render() {
const { label, value, onChange } = this.props;
return (
<TextField
label={label}
value={value}
onChange={onChange}
/>
);
}
}
class ParentComponent extends React.Component {
constructor(props) {
super(props);
this.state = {
inputValue: '',
};
}
handleInputChange = (event) => {
this.setState({ inputValue: event.target.value });
}
render() {
return (
<div>
<MyTextField
label="Example"
value={this.state.inputValue}
onChange={this.handleInputChange}
/>
</div>
);
}
}
这样,就可以通过包装React组件的方式传入material-component的TextField属性。在父组件中,可以通过props将属性传递给子组件,并在子组件中使用material-ui的TextField组件进行展示和交互。
腾讯云相关产品和产品介绍链接地址:
领取专属 10元无门槛券
手把手带您无忧上云