ElementUiツリー構造でデフォルトで選択されたイベントを解決します（完璧なソリューション）

最近、ElementUiのel-treeコンポーネントを使用し、選択効果のあるバックグラウンド管理システムを作成しました。データを変更する場合、元の選択されたデータをツリー構造にレンダリングし、データを作成し、デフォルトでチェックする必要があります。キーはバックグラウンドから取得したすべてのデータであるため、変更操作を実行すると、選択した効果が期待どおりに反映されません。後で、el-treeをレンダリングする前に、デフォルトを取得する必要があることがわかりました-選択したデータチェックされたキーの、そうでない場合、デフォルトの選択された状態はレンダリングされません。

        <el-tree
                    v-if="isShowTree"
                    :data="zTree"
                    :props="defaultProps"
                    :default-checked-keys="defaultTree"
                    node-key="cDptCde"
                    ref="tree"
                    show-checkbox
                    @check-change="handledeptNodeClick"
                    class="div-border box-card">
            </el-tree>

そこで、isShowTree状態を使用しました。データの詳細を取得してdefault-checked-keysを取得したら、isShowTree = trueを設定します。props属性を使用する場合は、データデータが取得されるまで待つ必要があります。el-treeをレンダリングします。つまり、isShowTreeを設定できるのは、データデータとデフォルトチェックキーデータを同時に取得した場合のみです。そうすれば、選択した効果でツリー構造を完全にレンダリングできます。解決できない問題がある場合、あなたはそれを試すことができます。テスト！使用する

        computed: {
           /*从后台获取递归数据*/
            zTree() {
                return this.$store.getters.zTree.tree
            },
            /*是否展示机构数*/
            isShowTree(){
               // this.zTree.length --->如果leng>0,代表已获取到data的数据
               // this.isGetDetail--->如果isGetDetail为true，则说明已经获取到default-checked-keys的数据
                return this.zTree.length&&this.isGetDetail
            }