react➕antd中使用switch...case...

最新推荐文章于 2025-07-16 10:11:30 发布

小红同学5

最新推荐文章于 2025-07-16 10:11:30 发布

阅读量1.5k

点赞数

CC 4.0 BY-SA版权

分类专栏： react antd

本文链接：https://blog.youkuaiyun.com/xh_960125/article/details/89849821

本文介绍了如何在React应用中结合Ant Design，利用switch...case...语句进行条件渲染和逻辑控制。内容包括使用效果的展示，以及关键和详细代码的分享。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1，使用switch...case...效果

2，主要代码

 switch (num) {
    case 1 :
      return (<span>{}</span>);
      break;
    case 2 :
      return (<span> {}</span>);
      break;

    default :
      return (<span> {}</span>);
      break;
  }

};

3，详细代码

import React, { PureComponent } from 'react';
import { Link } from 'react-router-dom';
import { connect } from 'dva';
import { Row, Col, Table, Radio, Input, Form, Button, Icon, DatePicker, Select, Modal, Popconfirm, Checkbox, message, Tag,
  TreeSelect,Menu,Dropdown, Tree,notification,Alert,Upload,Popover
} from 'antd';
import styles from './studentsList.less';

const TreeNode = TreeSelect.TreeNode;
const FormItem = Form.Item;
const RadioButton = Radio.Button;
c