Lösen Sie die standardmäßig ausgewählten Ereignisse in der ElementUi-Baumstruktur (die perfekte Lösung).

Ich habe kürzlich ein Hintergrundverwaltungssystem erstellt, das die el-tree-Komponente von ElementUi verwendet und einen Auswahleffekt aufweist. Beim Ändern der Daten müssen die ursprünglich ausgewählten Daten in die Baumstruktur, die Daten und die standardmäßig überprüften Daten der Schlüssel gerendert werden Wenn alle Daten aus dem Hintergrund stammen, wird der ausgewählte Effekt bei der Ausführung des Änderungsvorgangs nicht wie erwartet wiedergegeben. Später stellte ich fest, dass ich vor dem Rendern des el-Baums die Standardeinstellung "Die ausgewählten Daten von" abrufen musste markierte Tasten, andernfalls wird der standardmäßig ausgewählte Status nicht gerendert.

        <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>

Also habe ich einen isShowTree-Status verwendet. Als ich die Datendetails und die standardmäßig aktivierten Schlüssel erhalten habe, habe ich isShowTree = true gesetzt. Wenn Sie das Requisitenattribut verwenden, müssen Sie warten, bis die Datendaten abgerufen wurden. El-tree rendern Das heißt, Sie können isShowTree nur festlegen, wenn Sie gleichzeitig Datendaten und Daten mit standardmäßig überprüften Schlüsseln erhalten. Anschließend können Sie die Baumstruktur mit dem ausgewählten Effekt perfekt rendern. Wenn ein Problem vorliegt, das nicht gelöst werden kann , Sie können es versuchen. Test! verwenden

        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
            }

Ich denke du magst

Origin blog.csdn.net/weixin_43169949/article/details/104966499
Empfohlen
Rangfolge