получить дом от контента в vuejs

Question

скажем, у меня есть несколько div на моей странице:

<div id="root">
   <div id="content1" v-html="content"></div>
   <div id="content2"></div>
   <div id="content3"></div>
</div>

и я пишу скрипт:

cont myapp = new Vue({
  el:'#root'
  ,data:{'content':''}
  ,methods{
    get_content_dom:function(){
      return document.getElementById('id_from_content');
    }
  }
})

как установить метод get_content_dom для поиска dom, где html content
, потому что, может быть, когда-нибудь я захочу переместить контент html в # content1 или # content2 или # content3.

любой способ установить метод для получения содержимого html?

================================================= =============================

Моя точка зрения в том, что мне нужно знать DOM, когда происходит событие клика:

допустим, у меня есть несколько div на моей странице:

<div id="root">
   <div id="content1"></div>
   <div id="content2" v-click="fired"></div>
   <div id="content3"></div>
</div>

и я пишу скрипт:

cont myapp = new Vue({
  el:'#root'
  ,data:{'content':''}
  ,methods{
    fired:function(){
      console.log('here is my dom and i can get current div id #content2');
    }
  }
})

Answer 1

Я бы не рекомендовал использовать DOM для управления контентом. Вместо этого управляйте контентом с вашими данными

data: () => ({
  contents: ['content 1', 'content 2', 'content 3']
}),
methods: {
  fired (event, content, index) {
    console.log('Click event on DOM element', e.target)
    console.log('Click event on content index', index)
    console.log('Click event on content', content)
  }
}

<div id="root">
  <div v-for="(content, index) in contents"
       :id="`content${index + 1}`" 
       :key="index"
       @click="fired($event, content, index)"
       v-html="content"></div>
</div>