In vue, the method to call subcomponents through refs is undefined

there is a list:

<ordiary-group
   v-for="(commonAttr, index) in warePublishData.commonAttrs"
   :ref=""ref_ordiary_group_" + index"
   :key=""ordiary_group_" + commonAttr.propertyId"
   :property-id="commonAttr.propertyId"
   :attribute-type="commonAttr.inputType"
   :attribute="commonAttr"
   :checked-list="getCheckedList(commonAttr.propertyId)"
   @validate-ordinary="validateOrdinary">
</ordiary-group>

then I need to get the refs, of each list as follows:

    validate() {
            let _self = this
            let validate = () => {
                let passFlag = true
                for (let i = 0, len = this.warePublishData.commonAttrs.length; i < len; iPP) {
                    let result = _self.$refs["ref_ordiary_group_" + i]
                    _self.$nextTick(() => {
                        console.log(result)
                        console.log(result.validateXX)
                    })
                }
            }
            return validate()

        }

there is a validateXX method to print out the content of the component, but it is undefined, when you get it. What is the reason?

Undefined vue.js

Mar.09,2021

$nextTick (() = > {
let result = _ self.$refs ['ref_ordiary_group_' + I]
.
})

in which period did you execute? Mounted just started to get the refs.

the problem I encountered before is that I used an event bus in my project, which caused the problem of switching routes back and forth. The solution:
add:

to the route jump page

destroyed() {
    this.$event.$off()
}

The

node has not been generated yet. Try adding a timer

Previous: Docker deployment script issu

Next: There is no prompt for dom operation when webstrom writes js.