import { createElement, render, useState } from 'rax';
import DriverUniversal from 'driver-universal';
import { CascaderSelect, Button } from '@alifd/meet';
import View from 'rax-view';
import Text from 'rax-text';
import provinceData from './mock/provinces';
import treeData from './mock/tree';
import './index.css';

const sizes = ['small', 'medium', 'large'];

const CascaderSelectDemo = () => {
  const [treeVal, setTreeVal] = useState([]);

  const handleChange = (v) => {
    setVal(v);
  };

  return (
    <View>
      <Text className="demo-title">Reset</Text>
      <CascaderSelect
        placeholder={'please select ...'}
        dataSource={treeData}
        onChange={(v, data, extra) => {
          console.log('tree', v, data, extra);
          setTreeVal(v);
        }}
        value={treeVal}
      />
      <Button
        className="btn"
        type="primary"
        onClick={() => {
          setTreeVal(undefined);
        }}
        block
      >
        reset
      </Button>
    </View>
  );
};

// render(<CascaderSelectDemo />, null, { driver: DriverUniversal });
 export default CascaderSelectDemo