菜单 学习猿地 - LMONKEY

VIP

开通学习猿地VIP

尊享10项VIP特权 持续新增

知识通关挑战

打卡带练!告别无效练习

接私单赚外块

VIP优先接,累计金额超百万

学习猿地私房课免费学

大厂实战课仅对VIP开放

你的一对一导师

每月可免费咨询大牛30次

领取更多软件工程师实用特权

入驻
20
0

react中如何使用组件

原创
05/13 14:22
阅读数 1285

react中如何使用组件

前文我们介绍过了《如何写react组件》(感兴趣的同学可以过去学习),下面我们来说一下如何使用react组件。

1、无状态组件的使用方法

组件:

const App = (props) => <h1>欢迎进入{props.name}的世界</h1>

使用:

ReactDOM.render(
  // React组件的调用方式
  <App name="react" />,
  document.getElementById('root')
)

2、ES6创建的组件的使用方法()

组件:

class App extends React.Component{
    render(){
        return(
            console.log(this),//此处的this指的就是App组件,自定义在App上的属性就在this的props上
            <h1>Hello {this.props.name}React!</h1>
        )
    }
}

使用:

ReactDOM.render(
    <App name="1905"/>,//在App组件上自定义一个name的属性
    document.getElementById('root')
)

发表评论

0/200
20 点赞
0 评论
收藏
为你推荐 换一批