0

Ситуация такая есть такой вот код:

<f7-list form id="address-form">
  <!-- Textarea -->
  <f7-list-item>
  <f7-input type="textarea" placeholder="Default address" id="address"  v-model.text="address"></f7-input>
  </f7-list-item>
  </f7-list>
  <!-- Button Nex -->
  <f7-block>
  <f7-button class="" value="1" id="btnPageAdress" href="#" @click="getFormValues()">Next</f7-button>
  </f7-block>

Ну и скрипт

<script>
    export default {
    name: 'app',
      data() {
          return {
            address: ''
          }
        },
      methods: {
        getFormValues () {
            var sendAddess = this.address
            console.log(this.sendAddess)
        }
      }
        }
</script>

Не понимаю чего не работает. Может кто-то помочь.

ПС (Разобрался немного больше в ситуации, суть какая в инпут приходят данные при загрузке страницы, но загвоздка в том что если не будет активности(фокуса) по инпуту то данные не запушутся в переменную address. Я так понимаю нужен какой-то вотчер который будет отслеживать элемент или чекать каждые пол сек примерно. Но я ток начал работать с Vue и пока не представляю как это сделать)

1
  • Не очень понятно про "если не будет активности" - у вас адрес заранее чем-то должен быть заполнен или есть иной источник данных, помимо формы ввода, из которого адрес должен подтянуться до отображения формы? Vue автоматически поменяет данные, когда будет активность в поле ввода, так что вотчер не требуется.
    – Lyth
    5 дек 2017 в 10:52

1 ответ 1

0

Если нужно ждать загрузки данных от компонента, то используй $emit в компоненте а $on в родителе. Более подробнее https://ru.vuejs.org/v2/guide/components.html#Использование-v-on-с-пользовательскими-событиями

var app = new Vue({
  el: '#app',
  data() {
    return {
      message: ''
    }
  },
  methods: {
    getMessage () {
      alert(this.message)
    }
  }
})
<div id="app">
  <input type="text" v-model="message">
  <button @click="getMessage">Получить данные</button>
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.3.4/vue.min.js"></script>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.