如圖，動態(tài)添加節(jié)點為一行文字和對應(yīng)的input，input原本是隱藏的，點擊文字之后顯示input。之后我想讓input獲得焦點（focus），但不知該如何恰當?shù)墨@取這個input（不使用DOM操作）。

代碼如下：（html文件）

<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<div id="app">
        <test v-for="(item,index) in items" :item="item" @show="show"></test>
</div>
<script>
Vue.component('test',{
    props:['item'],
    template:
    `
    <div>
        <p @click="show($event,item)">{{item.text1}}</p>
        <input v-model="item.text1" v-show="item.show_input" :ref="item.text1"></input>
    </div>
    `,
    methods:{
        show(event,item){
            this.$emit('show',event,item);
        }
    }
});
new Vue({
    el:'#app',
    data:{
        items:[
            {
                'text1':'aaaaaaa',
                'show_input':false
            },
            {
                'text1':'bbbbbbb',
                'show_input':false
            }
        ]
    },
    methods:{
        show(event,item){
            item.show_input=true;
            let ref_name=item.text1;
            console.log(this.$refs.ref_name); // undefined

        }
    }
});
</script>