react 根据条件渲染页面(多种条件)

js源码:

import React, { Component } from 'react';

import styles from './css/User.css';

 

class AddUser extends Component {

    constructor(props) {

        super(props);

        this.state = {role: 1,

        };

    }

 

    /**

     * 主体

     */

    render() {

        let teacherDom = null

        if (this.state.role === 1 && this.state.role!=2) {

            teacherDom = 

               

教师条件下的dom

            

 

        }

          let studentDom = null

        if (this.state.role === 2 && this.state.role !==1) {

            studentDom = 

               

学生条件下的dom

            

 

        }

        return (

            

                    {/*教师特有******************************************************************** */}

                    {teacherDom}

                    {/*学生特有******************************************************************** */}

                    {studentDom}

                   

            

        );

    }

}

export default AddUser

 

你可能感兴趣的:(react)