Target the textarea of a child component to copy to clipboard

I have a working function which targets a textarea and copies the content to a clipboard. It works great when targeting a textarea directly.

I need the same functionality targeting the textarea within a child component(s). I can't figure out how to target that specific area within each component.

Working example:

<div class="media-label col-md-12">Product Title:</div>

<textarea 
  class="col-md-6 col-md-offset-3" 
  v-model="productTitle" 
  id="productTitle"
></textarea>

<button 
  type="button" 
  class="btn btn-info"
  data-copytarget="#productTitle" 
  v-on:click="copyTextArea"
>
  Copy Title To Clipboard
</button>

The copy function:

 copyTextArea(e) {
   var targetElement = e.target;
   var copiedTarget = targetElement.dataset.copytarget;
   var element = document.querySelector(copiedTarget);
   element.select();
   document.execCommand('copy');
 },

Component setup I'm having issues with:

<ExampleComponent
  title="Title" 
  input-type="textarea"
  v-model="productTitle" 
  id="productTitle" 
></ExampleComponent>

<button 
  type="button" 
  class="btn btn-info"
  copytarget="#productTitle" 
  v-on:click="copyTextArea"
>
  Copy Title To Clipboard
</button>

<ExampleComponent
  title="Description" 
  input-type="textarea"
  v-model="productTitle" 
  id="productTitle"
></ExampleComponent>

<button 
  type="button" 
  class="btn btn-info"
  copytarget="#productTitle" 
  v-on:click="copyTextArea"
>
  Copy Title To Clipboard
</button>