import 'whatwg-fetch';
import CascaderSelect from '..';
import React from 'react';
import ReactDOM from 'react-dom';
interface PageStates {
  data: Array<any>;
}
class Demo extends React.Component<{}, PageStates> {
  valueRender: (item: any) => any;
  constructor(props) {
    super(props);

    this.valueRender = item => {
      if (item.label) {
        return item.label;
      }

      return item.value === '432988' ? '不存在的值' : item.value;
    };
    this.state = {
      data: [],
    };
    this.handleChange = this.handleChange.bind(this);
  }

  componentDidMount() {
    fetch('https://os.alipayobjects.com/rmsportal/ODDwqcDFTLAguOvWEolX.json')
      .then(response => response.json())
      .then(data => {
        data[1].disabled = true;
        this.setState({ data });
      })
      .catch(e => console.log(e));
  }

  handleChange(value, data, extra) {
    console.log(value, data, extra);
  } // 正常的item

  // value在 dataSouce里不存在时渲染。
  render() {
    return (
      <CascaderSelect
        valueRender={this.valueRender}
        defaultValue="432988"
        dataSource={this.state.data}
        onChange={this.handleChange}
      />
    );
  }
}

ReactDOM.render(<Demo />, document.getElementById('cascader-select-demo-12'));