import { View, Text, Image, Button, Icon } from "@tarojs/components";
import { useLoad } from "@tarojs/taro";
import Taro from "@tarojs/taro";
import {
  AtAvatar,
  AtTag,
  AtIcon,
  AtTabBar,
  AtButton,
  AtAccordion,
  AtList,
  AtListItem,
} from "taro-ui";
import "./index.scss";
import beijing from "@/images/city/beijing.jpg";
import guangzhou from "@/images/city/guangzhou.jpg";
import shanghai from "@/images/city/shanghai.jpg";
import shenzhen from "@/images/city/shenzhen.jpg";
import touxiang from "@/images/index/touxiang.jpg";
import TabbarCom from "@/componments/TabbarCom";
import { useEffect, useState } from "react";
import _ from 'lodash';


const Quesion = () => {
  const [open, setopen] = useState(false);
  const [AccordionArr, setAccordionArr] = useState([
    {
      title: "常见问题一",
      answer: "这是文本段落。这是文本段落。",
      open: false,
    },
    {
      title: "常见问题二",
      answer: "这是文本段落2。这是文本段落2。",
      open: false,
    },
  ]);

  return (
    <View className="Quesion">
      {AccordionArr.map((item, index) => {
        return (
          <AtAccordion
            open={item?.open}
            onClick={() => {
              // setopen(!item?.open);
              AccordionArr[index].open = !AccordionArr[index].open;
              console.log("AccordionArr", AccordionArr);
              // 深拷贝
              let newAccordionArr = _.cloneDeep(AccordionArr)
              setAccordionArr((newAccordionArr) );
            }}
            title={item?.title}
          >
            <View className="at-article__p">{item?.answer}</View>
          </AtAccordion>
        );
      })}
    </View>
  );
};

export default Quesion;
