如何从父组件影响子组件中的元素？下面的代码是我尝试实现的简化版本，注解显示了各种失败的尝试。
父项：

import InputText from "./InputText.js";

export default {

    components: { InputText },

    template: `

        {{ things }}<br><br>

        <input-text v-for="thing in things" :key="thing.id" :thing="thing" />
        
        <br><br>
        
        <button @click="focusBox()">TEST</button>
        
    `,

    data() {
        return {
            things: [{
                "id": 1,
                "name": ""
            }, {
                "id": 2,
                "name": ""
            }, {
                "id": 3,
                "name": ""
            }]
        }
    },

    methods: {
        focusBox() {
            // this.$refs.thing.id[2].focus();
            this.$nextTick(() => this.$refs.thing_2.focus());
        }
    }
}

子项：

export default {

    template: `
        <input type="text" v-model="thing.name" :ref="'thing_' + thing.id">
        <!-- <input type="text" v-model="thing.name" ref="thing.id"> -->
        <br>
    `,
    props: {
        thing: Object
    }

}

提前感谢。