v-on:keyup & v-model not updating data

Asked Oct 02 '19 at 04:31

Active Oct 02 '19 at 05:36

Viewed 303 times

I'm trying to simply update a variable in data through a v-model on a text input, currently it's throwing no errors, and not updating the variable. The JS is in script tags under the html, not an imported component. Any help would be amazing! :)

var vm = new Vue({
  el: '#cover',
  data: {
    message: '',
  },
  methods: {
    mirror: function() {
      console.log('mirrored')
    },
  }
})

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

<div id="cover">
  <h1><strong><span id="goldMoney">@{{ message }}</span></h1>

  <div class="mainSearch" id="vueSearch">
    <input 
      type="text" 
      name="mainSearch" 
      placeholder="Whatchya feel like?" 
      v-model="message" 
      id="searchBox"
    />
  </div>
</div>

edited Oct 02 '19 at 05:36

Phil

157,677
23
242
245

asked Oct 02 '19 at 04:31

rargy

Are you using vue-cli or just using cdn – saravana Oct 02 '19 at 04:41
Just the cdn for this page – rargy Oct 02 '19 at 04:41
Just wrap your html code with an element like this
your html
you are not added your parent element with id cover – saravana Oct 02 '19 at 04:43
it is wrapped in
already
– rargy Oct 02 '19 at 04:45
may be try comment the html code other than you are shared – saravana Oct 02 '19 at 04:54
1

You might have a typo somewhere we can't see. If I run it as you have it, it works. – Oct 02 '19 at 05:11
And you mention onkeyup but that's not in here. – Oct 02 '19 at 05:14
i put it as it is into code snippets that run so people can see yours works, here. – Oct 02 '19 at 05:28
1

btw, you're missing a ``. Sometimes HTML errors, if you're building it in something, can get in the way. – Oct 02 '19 at 05:30

v-on:keyup & v-model not updating data

0 Answers0