Ant-design: antdTreeとTreeNodeを使用した動的ツリー

作成日 2017年01月22日  ·  3コメント  ·  ソース: ant-design/ant-design

const Leaf = ({ id }) => <Tree.TreeNode title={doing something dynamic here} />

...
<Tree>
    { instances.map(instance => <Leaf key={instance} id={instance} />) }
</Tree>

アリの木は動的/コンポーネント指向ではないようです。 TypeError: props.filterTreeNode is not a functionのようなエラーが発生しない限り、ツリーノードを返す方法はありません。

これを解決する方法がわかりません。 各リーフコンポーネントはリアクティブである必要があります。パフォーマンス上の懸念から不可能な、変更ごとにツリー全体をレンダリングしない限り、ネストされたすべてのデータを事前に取得する方法はありません。

最も参考になるコメント

@yesmeck @benjycui @warmhug
TreeNodeがスタンドアロンで構成可能なクラスになる可能性はありますか? TreeTreeNoderc-treeの別々のクラスなので、これは可能であるはずですか、それとも間違っていますか?

TreeNodeがスタンドアロンのクラスであることに本当に感謝しています。それは多くの可能性を提供し、より「反応的」に感じるからです。

全てのコメント3件

こんにちは@drcmdaTreeNodeは現在のアーキテクチャでは構成できません。

コードを次のように変更します。

<Tree>
    { instances.map(instance => 
      <Tree.TreeNode key={instance} title={doing something dynamic here} />) 
    }
</Tree>

@yesmeck事前にネストされた構造が必要になるため、それは不可能ですが、ネストされたコンポーネントのみがサブコンポーネントを認識しています(状態に関連付けられています)。 しかし、私は自分のツリーを書くことになりました。 これがいつか解決されることを願っています。 :)

@yesmeck @benjycui @warmhug
TreeNodeがスタンドアロンで構成可能なクラスになる可能性はありますか? TreeTreeNoderc-treeの別々のクラスなので、これは可能であるはずですか、それとも間違っていますか?

TreeNodeがスタンドアロンのクラスであることに本当に感謝しています。それは多くの可能性を提供し、より「反応的」に感じるからです。

このページは役に立ちましたか?
0 / 5 - 0 評価