Question

我需要显示一个分为年和月的图表。一开始，我创建了12个带有几个月的道具（以下代码），多年来创建了2个道具，并创建了时间表。


        this.state = {
            menu: [  //year
                {
                    key: 2018,
                    title: "2018",
                    opened: true,
                },
                {
                    key: 2019,
                    title: "2019",
                    opened: false
                }],
            active_menu: 2018, //key from opened (active) year
            info: [   //months with data
                {
                    key: 11,
                    title: 'December',
                    opened: true,
                    content: []
                },{
                    // other months
                }],
            active_month: 11 //key from opened (active) month
        }

现在有困难...例如，在2018年，月份的倒计时从9月到12月开始，而在2019年只有1月。此外，当我为计划获取数据时，我专注于用户选择的月份，并将其替换为查询。

如果不是一件事，这也没问题：我不需要显示年份中不存在的元素（例如，如果用户选择了2019年，则只需要显示一月））我想撤消2018年9月至12月的所有月份，而对于2019年，请在月结时尽快显示每个月（例如，2月只会出现在3月1日）

现在，我非常清楚地了解到，在当前的实现方式下，我无法实现必要的功能，但是对如何最好地做到这一点的理解也无法解决……请向我提供建议，我真的很沮丧。

很抱歉，我没有人要请教

Answer 1

希望它可以使您了解如何构造数据。

首先，如果您的实际数据没有更改，则可以将其放入常规... active_menu: 2018, //key from opened (active) year info: [ //months with data { key: 11, title: 'December', opened: true, content: [] }, { // other months } ], active_month: 11 //key from opened (active) month中，并在以后引用。但是，我们将继续使用您现有的模式。

this.state.info

我们可以完全专注于与您的月份有关的状态。只需用您实际需要的月份填充class sampleComponent extends React.Component { constructor(props) { super(props); this.handleClick = this.handleClick.bind(this); } handleClick(index) { let copy = [...this.state.info]; //create local copy of state array let active = copy[index].key; this.setState({active_month: active}); } render() { const buttons = this.state.info.map((month, index) => <button onClick={() => handleClick(index)} key={month.key}/> ); return ( //return anything else here {buttons} ) } }，以后您就可以在它们上进行映射。

例如

func showToast(controller: UIViewController, message : String, seconds: Double) {

    let alert = UIAlertController(title: nil, message: message, preferredStyle: .alert)
    alert.view.backgroundColor = UIColor.black
    alert.view.alpha = 0.6
    alert.view.layer.cornerRadius = 15
    controller.present(alert, animated: true)

    DispatchQueue.main.asyncAfter(deadline: DispatchTime.now() + seconds) {
        alert.dismiss(animated: true)
    }
}

您只会渲染直接连接到您所在州的按钮，并且只能处理您所在州的月份。希望这有助于回答您的问题。

图表和道具状态

1 个答案: