美文网首页
React 自定义组件

React 自定义组件

作者: 基本密码宋 | 来源:发表于2017-11-02 22:37 被阅读569次

    其实刚才生产目录中有个 app.js
    里面是用 es6语法写的 自定义控件

    创建一个名字为MyCommpent 的自定义控件
    导入 React 和 Component

    import React ,{Component}from 'react'
    

    定义类

    import React ,{Component}from 'react'  //导入 React Component
    
    class MyCommpent extends Component{ //定义类继承 Compoent 
    
        render(){ //render就是返回一个标签        
            return(
                <div>
                    <h1>这个是自定义组件</h1>
                </div>
            )
        }
    }
    
    export default MyCommpent ;  //将此标签导出 。方便其他地方的调用使用
    

    其他地方的导入并使用此标签

    import React from 'react';
    import ReactDOM from 'react-dom';
    import './index.css';
    import App from './App';
    import registerServiceWorker from './registerServiceWorker';
    
    import MyCommpent from './MyCommpent'  //导出组件 方便使用
    
    
    
    // ReactDOM.render(<App />, document.getElementById('root'));
    
    // ReactDOM.render(params1,params2); params1:控件的名称  pararms2:放到位置的id
    ReactDOM.render(<MyCommpent/>,document.getElementById('root'))
    
    
    registerServiceWorker();
    
    

    相关文章

      网友评论

          本文标题:React 自定义组件

          本文链接:https://www.haomeiwen.com/subject/hltzpxtx.html