小编Bal*_*731的帖子

从父组件向子组件添加动态 html 属性 - React.js

子组件:

export default class Button extends React.Component {
constructor(props) {
    super(props);
}
render() {
 return(
        <div className="form-group">
            <button

                // Need to add dynamic html attr here e.x: data-id

                key={index} 
                id={id} 
                className={`btn btn-default ${componentClass ? componentClass : null }`} 
                type="button"
                onClick={this.props.onClick}> 

                {text}

            </button>
        </div>
    );}}
Run Code Online (Sandbox Code Playgroud)

父组件:

import Button from './Button';

Class App extends React.Component {
    constructor(props) {
        super(props);
    }
    render() {
        return (
            <div className="s">
             <Button data-id="exampleData" />  // Need to add data-id attr to child button
            </div>
        );
    }
Run Code Online (Sandbox Code Playgroud)

按钮组件,有它自己的默认属性,如上所述:id,className,type,onClick …

reactjs

5
推荐指数
1
解决办法
4817
查看次数

标签 统计

reactjs ×1