Question

我正在编写一个React组件，使我的文本可编辑。单击时，它会呈现输入，当模糊时，它会像以前一样呈现文本。

为了使它工作，我必须在我的元素中加入很多属性。我想处理许多类型的输入（文本，数字，日期，文本区域......），我不想一直重复这个列表。

有没有办法只写一次这个列表并将其注入我的元素中？

这样的事情：

const options = "value={this.props.value} placeholder={this.props.placeholder} onChange={this.props.onChange}  onBlur={this.stopEdit} ref={(e) => {this.eRef = e;}}";

后来就这样使用了：

render() {
    return (<input type="text" {{options}} />);
}

我读过关于dangerouslySetInnerHTML的内容，但是没有做我需要的事情。

非常感谢你的帮助！

Answer 1

为什么你不这样使用

const options = {
  value: this.props.value,
  placeholder: this.props.placeholder,
  ...
}

和html = <input type="text" {...options}/>

或者您可以使用

html = React.createElement('input', {type: 'text', ...options})

Answer 2

如果您正在查看如何使元素中的文字可编辑，可以将content-editable="true"属性附加到元素。

希望这有帮助！

如何在ReactJS中将属性列表作为字符串注入

2 个答案: