| <script> | |
| import Child from './Child.vue' | |
| export default { | |
| components: { | |
| Child, | |
| }, | |
| props: { | |
| count: { | |
| type: [Number, String, null], | |
| default: 4, | |
| }, | |
| }, | |
| data() { | |
| return { | |
| childRefs: [], | |
| } | |
| }, | |
| beforeUpdate() { | |
| this.childRefs = [] | |
| }, | |
| } | |
| </script> | |
| <template> | |
| <div> | |
| <h3 ref="title"> | |
| Nest children | |
| </h3> | |
| <Child | |
| v-for="i in count" | |
| :key="i" | |
| :ref="target => target && childRefs.push(target)" | |
| /> | |
| <div> | |
| <Child | |
| v-for="i in count" | |
| :key="i" | |
| :my-attr="i" | |
| /> | |
| </div> | |
| </div> | |
| </template> | |