Как асинхронизировать загрузку узлов с помощью выбора дерева дизайна муравьев? - PullRequest
0 голосов
/ 06 сентября 2018

Компонент: https://ant.design/components/tree-select/ Нет примера с параметром loadData.

async getChildren(node) {
    console.log(node);
    let r = $.get("/tree", {id: node.value})
    console.log(await r);  // request works
    return r;
}

С этим кодом я просто вижу загрузку дерева и ничего не происходит. Не ошибка, но дочерние узлы не добавляются в дерево.

Если я не возвращаю обещание, я получаю огромную ошибку и пустую страницу.

1 Ответ

0 голосов
/ 07 сентября 2018

это пример функции loadData:

 onLoadData = (treeNode) => {
    console.log('load data...');
    return new Promise((resolve) => {
      setTimeout(() => {
        const treeData = [...this.state.treeData];
        getNewTreeData(treeData, treeNode.props.eventKey, generateTreeNodes(treeNode), 2);
        this.setState({ treeData });
        resolve();
      }, 500);
    });
  }

Вы можете найти его здесь с более глубокими примерами

Чтобы было понятнее:

  • TreeData является массивом TreeNode источник
  • Выбор дерева antd использует rc-дерево, потому что antd построен поверх компонентов rc Вы можете увидеть источник
  • Для ленивой загрузки вам нужно манипулировать treeNode, что выше фрагмента делает: каждый раз, когда загружаются новые данные, это будет объект treeNode, и вызовет функцию обратного вызова onLoadData (), где вы предоставляете код, что делать с этим узлом. (образец просто добавить к treeData состояния переменная] * * тысячу двадцать-один
...