Обходной путь для фокусировки на вводе после того, как компонент установлен на мобильном сафари - PullRequest
Новая
       13

Обходной путь для фокусировки на вводе после того, как компонент установлен на мобильном сафари

0 голосов
/ 22 апреля 2019

Я не могу установить фокус ввода после того, как компонент Vue установлен в Safari Mobile.В моем другом проекте, основанном на jQuery, я решаю эту ошибку с помощью запуска touchstart на обработчике click.Но в Vue этот прием не работает.

Я знаю, что в мобильном сафари я не могу вызвать событие фокуса вне реальной функции-обработчика событий взаимодействия с пользователем.Как я могу решить эту проблему? 

Vue.component('btn', {
  template: '<button  @click="handleClick"  type="button">click me baby</button>',
  methods: {
    handleClick: function() {
      setTimeout(() => {

        var i = setInterval(() => {
            var el = document.querySelector('.tarea')
          if(el) {
            el.focus();
            clearInterval(i);
          }
        }, 400);

         this.$emit('bebe');

      }, 1000)
    }
  }

});
Vue.component( 'my-input', {
    data() { return {value: 'lorem ipsum'}},
    template: '<div><textarea class="tarea" v-model="value" ></textarea></div>'
});

new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue.js!',
    isVisible: false,
  },
  methods: {
    onBebe: function() {

      this.isVisible = true;
    }
  }
})

Вы можете проверить свои решения здесь: https://jsfiddle.net/eLw7roup/17/

Я использую демонстрационную версию appetize.io для тестирования

...