单选切换资源demo

需求

现在要实现这么一个功能，点击餐饮按钮，弹出弹窗，弹窗上根据男生和女生，下载不同模板，填写模板，上传不同的三餐规划及需求，根据上传的资料调用接口分析，得到食物种类数量foodTypeNum和几顿饭mealNum，有值就展示“资料确认 共n中食物种类，n顿餐”，否则隐藏。
重点：选男生时，上传资料，解析后显示资料名称等信息，资料确认显示；切换女生时全部信息为空；再切回男生仍是刚刚上传的资料和解析的结果。

技术栈

React组件
AntD
Less（demo里就不用了）

框架代码

import React, { Component } from "react";
import { Radio, Button } from "antd";

class uploadResourceModule extends Component {
	constructor(props) {
		super(props);
		this.state = {
			showResource: false, // 资料显示
			foodTypeNum: 0, // 食物种类数量
			mealNum: 0, // 几顿饭
			boyShowResource: false,
			boyFoodTypeNum: 0,
			boyMealNum: 0,
			girlShowResource: false,
			girlFoodTypeNum: 0,
			girlMealNum: 0,
			sex: 1, // 男1，女2
		}
	}
	
	// 切换男女生资料
	sexResource = () => {
		if(this.state.sex === 1) {
			this.setState({
				showResource: boyShowResource,
				foodTypeNum: boyFoodTypeNum,
				mealNum: boyMealNum
			});
		} else if(this.state.sex === 2) {
			this.setState({
				showResource: girlShowResource,
				foodTypeNum: girlFoodTypeNum,
				mealNum: girlMealNum
			});
		}
	}

	componentDidMount() {
		this.sexResource();
	}

	resourceClick = () => {
		// 解析资源，调接口，sex为1或2分别给两组数据赋值
	}

	// 性别切换
	changeSex = e => {
		this.setState({
			sex: e.target.value
		}, () => {
			this.sexResource();
		});
	}

	render() {
		const { showResource, foodTypeNum, mealNum } = this.state
		return(
    		<div>
				<div>
					<div>性别</div>
						<Radio.Group onChange={this.changeSex} defaultValue={1}>
							<Radio value={1}>男</Radio>
							<Radio value={2}>女</Radio>
						</Radio.Group>
				</div>
				<div>
					<div>
						<Input onChange={this.resourceChange}></Input>
						<Button type="primary" onClick={this.resourceClick}>上传资料</Button>
					</div>
					<div onClick={this.downTemp}>下载模板</div>
				</div>
				<div>
					<div>1、只支持excel文档</div>
					<div>2、上传资料后将覆盖原资料</div>
					<div>3、下载模板后表单title不可变更</div>
				</div>
				<div>
					{ showResource ? <div>
						<div>资料确认</div>
						<div>共{foodTypeNum}种食物，{mealNum}顿饭</div>
					</div> : "" }
				</div>
    		</div>
		)
	}
}

export default uploadResourceModule;