vue中使用v-html给input标签实时赋值和提交改变的代码块

<div v-html="matter" id="html_id">{{matter}}</div>

data(){
    return{
        matter:"<input type="text"></input>"
    }
}

mounted(){
    this.nameInput()
}
//获取v-html为matter下的所有input标签
nameInput(){
    let inputArr=document.getElementById('html_id').querySelectorAll('input')
    for(let i=0;i<inputArr.length;i++){
        inputArr[i].addEventListener('blur',function(e){
            inputArr[i].setAttribute('value',e.target.value)
        })
    }
}
//获取改变后的代码块
submit(){
    let list=document.getElementById('html_id').innerHTML
}