vue.js - vuejs directive based on variable -




is possible dynamically assign directive? assign success or error based on variable named type. (which replace):

v-snackbar(v-if="type === 'success'", success, timeout=3000, bottom=true, right=true, v-model='snackbar') {{ snackbartext }}     v-btn(flat, @click.native="snackbar = false")         v-icon close v-snackbar(v-if="type === 'error'", error, timeout=3000, bottom=true, right=true, v-model='snackbar') {{ snackbartext }}     v-btn(flat, @click.native="snackbar = false")         v-icon close 

error , success not directives, props on v-snackbar component.

you can bind error , success props directly boolean expression or variable.

v-snackbar(:error="type === 'error'", :success="type === 'success'", timeout='3000', bottom='bottom', right='right', v-model='snackbar')     | {{ snackbartext }}     v-btn(flat='flat', @click.native='snackbar = false')       v-icon close 

here in html confused pug syntax.

<v-snackbar :error="type === 'error'" :success="type === 'success'" timeout="3000" bottom="bottom" right="right" v-model="snackbar">{{ snackbartext }}   <v-btn flat="flat" @click.native="snackbar = false">     <v-icon>close</v-icon>   </v-btn> </v-snackbar> 

take @ example 2 on vuetifyjs website more complete example. https://vuetifyjs.com/components/snackbars





wiki

Comments

Popular posts from this blog

Asterisk AGI Python Script to Dialplan does not work -

python - Read npy file directly from S3 StreamingBody -

kotlin - Out-projected type in generic interface prohibits the use of metod with generic parameter -