@minix-iot/ui/dist/mixins/relation/children.js

基于Vue的移动端轻量级UI组件库

import { VueExtension } from "../../utils/extensions/vue";

export function mixChildren(key, options={}){
    const indexKey = options.indexKey || 'index'

    return {
        inject:{
            [key]: {
                default: null
            }
        },
        computed:{
            parent(){
                if(this.disableBindingRelation){
                    return null
                }
                return this[key]
            },
            [indexKey](){
                this.bindRelation()
                if(this.parent){
                    return this.parent.children.indexOf(this)
                }
                return null
            }
        },
        watch:{
            disableBindingRelation(val){
                if(!val){
                    this.bindRelation()
                }
            }
        },
        mounted(){
            this.bindRelation()
        },
        beforeDestroy(){
            if(this.parent){
                this.parent.children = this.parent.children.filter(x=> x !== this)
            }
        },
        methods:{
            bindRelation(){
                if(!this.parent || this.parent.children.indexOf(this) !== -1){
                    return
                }
                this.parent.children = VueExtension.SortChildren([...this.parent.children, this], this.parent)
            }
        }
    }
}