打开组件模态时如何设置对文本区域的关注

I'm trying to create a post creator like Facebook when you press on the text area it pops up another form with another Textarea I have already done that but the problem here that I can not set focus on the textarea in the new modal that pops up when I click on old textarea here is an image for a better explanation

  <textarea class="form-control" placeholder="Write a post..." rows="3" v-model="post.Content"  :class="{ 'is-invalid': post.errors.has('Content') }" @click="postModal();setTextFocus()" @click.right="postModal();setTextFocus()"></textarea>

  <div class="modal-body"><!-- component modal -->
  <textarea class="form-control" v-bind:placeholder="'What is on your a mind, '+name+'?'" rows="3" v-model="post.Content"  :class="{ 'is-invalid': post.errors.has('Content') }" id="focusText" ref="textFocus"></textarea>
    <has-error  :form="post" field="Content"></has-error>
  </div>
methods:{
        postModal(){
            $('#postModal').modal('show');
            $("#myModal").on('shown.bs.modal', function(){
                $('#postModal').find('#focusText').focus();
            });

        },
        setTextFocus()
        {
            this.$refs.textFocus.focus();
        },