No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    Q Popup Edit - How to set computed vuex model @input?

    Help
    1
    2
    346
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • S
      stuartcusack last edited by stuartcusack

      I would like my q-popup-edit component to commit it’s v-model to my vuex store each time the user inputs (@input).

      Currently the value is not committed if the user click’s outside the popup or if the user navigates away from the router page destroying the popup.

      I could use the ‘buttons’ property and force the user to click ‘Set’ but I’d rather this behaviour.

      <q-popup-edit
          v-model="details">
      
              <q-input
              type="textarea"
              v-model="details"
              @keyup.enter.stop
              placeholder="Enter some details..."
              autogrow />
      
          </q-popup-edit>
      

      I’m sure I’ve done something similar before using :value and @input on a q-date field but I can’t figure it out this time.

      1 Reply Last reply Reply Quote 0
      • S
        stuartcusack last edited by stuartcusack

        I got it working. It was very easy in the end, I just switched ‘v-model’ for ‘value’ on the popup, but I don’t understand why either are necessary.

        My inputs already define the v-model so what are the reasons for v-model on the popup?? If you remove it you get an error.

        <q-popup-edit
            value="details">
        
                <q-input
                type="textarea"
                v-model="details"
                @keyup.enter.stop
                placeholder="Enter some details..."
                autogrow />
        
            </q-popup-edit>
        
        1 Reply Last reply Reply Quote 0
        • First post
          Last post