Vuetify: Modal button activator outside v-modal

[wobsoriano]

So the way the documentation says in creating a modal is

  <v-modal v-model="modal">
    <v-btn slot="activator" primary dark>Modal</v-btn>
    <v-card>
      <v-card-text>
        <h2 class="title">Use Google's location service?</h2>
      </v-card-text>
      <v-card-text class="subheading grey--text">Let google help apps determine location. This means sending anonymous location data to Google, even when no apps are running.</v-card-text>
      <v-card-row actions>
        <v-spacer></v-spacer>
        <v-btn flat v-on:click.native="modal = false" class="primary--text">Cancel</v-btn>
        <v-btn flat v-on:click.native="modal = false" class="primary--text">Submit</v-btn>
      </v-card-row>
    </v-card>
  </v-modal>

That perfectly works but what if we want to put the activator button outside of that modal? I tried doing v-on:click and settings the modal model to true but nothing happens.

[dohomi]

hey @sorxrob maybe this will help you: http://codepen.io/anon/pen/rjEqyw

you need to trigger v-model boolean value true/false. keep in mind to use @click.native.stop="yourModelSwitch" to make this work

[johnleider]

Does this solve your issue @sorxrob ?

[wobsoriano]

Thank you for the help! Solved.

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs. Please direct any non-bug questions to our Discord