vue versiones tutorial script framework espaƱol entre ejemplos comunicacion componentes certification javascript vue.js web-frameworks

javascript - versiones - Vue.js $ hijos por nombre del componente



vue script src (4)

Estoy tratando de acceder a un niño específico por su nombre. En este momento, debido a dónde está el niño, le estoy llamando al niño por esto:

this.$root.$children[0]

lo cual está bien siempre que ese niño siempre sea [0] idealmente sería genial si hay una manera de hacer algo como:

this.$root.$children[''detail'']

Sigo pensando que $ refs podría ser la causa de mi problema, pero nunca puedo encontrar una forma de que me ayude.

¿algunas ideas?


this.$root.$children[0].constructor.name


this.$root.$children[0].$options.name


¿Es este niño del que usted habla realmente un elemento secundario del componente desde el que desea acceder? En este caso, v-ref es de hecho la respuesta:

// in the code of the parent component, access the referenced child component like this: this.$refs.detailsChild

<!-- Template of the parent component, assuming your child Component is called Details --> <details v-ref:details-child></details>

Documentación relevante de la API: http://vuejs.org/api/#v-ref


No necesariamente necesita $refs , de hecho, a veces no son factibles si tiene componentes profundamente anidados. He encontrado esta sección de preguntas y respuestas varias veces mientras busco, pero finalmente decidí implementar mi propia solución ya que me encuentro con esta situación con bastante frecuencia. No se rehúse a la vieja escuela por bucles, son necesarios por un par de razones, para empezar, pruebo x<descendants.length (en lugar de establecer algo como len=descendants.length por adelantado, y probarlo contra eso) en cada iteración mientras estoy presionando en la pila en el segundo ciclo for.

Primero, uso:

let unPersonalizable = matchingDescendants(this, /a.checkimprintfiinformation$/, {first: true});

Implementación:

function matchingDescendants(vm, matcher, options) { let descendants = vm.$children; let descendant; let returnFirst = (options || {}).first; let matches = []; for (let x=0; x<descendants.length; x++) { descendant = descendants[x]; if (matcher.test(descendant.$vnode.tag)) { if (returnFirst) { return descendant; } else { matches.push(descendant); } } for (let y=0, len = descendant.$children.length; y<len; y++) { descendants.push(descendant.$children[y]); } } return matches.length === 0 ? false : matches; }