1

I had this working previously but after a few composer updates I'm now getting Vue related errors.

I"m doing a character countdown so in my HTML I have:

<div>Characters remaining:</div><div class="input-group-addon" v-text="{{remainingCount}}"></div>

And in my Vue code I have:

new Vue({
      el: '#postContent',
      data: {
        maxCount: 1400,
        remainingCount: 1400,
        message: '',
        hasError: false
      },
      methods: {
        countdown: function() {
          this.remainingCount = this.maxCount - this.message.length;
          this.hasError = this.remainingCount < 0;
        }
      }
    })

But when I load my page I get the error: Use of undefined constant remainingCount - assumed 'remainingCount' in the line of html above.

I'm not sure what change would have caused this but does it look like I'm doing something wrong in terms of laravel's understanding of the Vue syntax?

Update: This has been marked as a duplicate, or answered, but the answer referenced doesn't help. if I make it v-text="@{{remainingCount}}" then the error goes away but now my #postContent area from my Vue code is gone

Improve this question
2
  • I assume remainingCount is only vue variable. Why are you wrapping it into {{ }}? Why not use only v-text="remainingCount"? Or <div>{{remainingCount}}</div>. Commented Jun 5, 2019 at 13:55
  • Thank you @M1K1O, your solution resolved it! Commented Jun 5, 2019 at 13:57
Related questions
704
How can I remove a package from Laravel using PHP Composer?
621
How to create custom helper functions in Laravel
316
Vue 2 - Mutating props vue-warn
Load 6 more related questions Show fewer related questions

0

Reset to default

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.