Is it possible to use Square brackets in v-model name
-
Hi, is there a way to have or escape the square brackets in a v-model name so Vue doesn’t see it as an array or object?
v-model="item.lastservice[before]"
The reason why I’m asking is that I’m using Symphony and api-platform for my api, and api-platform “Default” DateFilter requires the query to be sent like this:
‘createdAt’ is a single field
api-platform date filter docs/offers?createdAt[after]=2018-03-19&createdAt[before]=2018-04-19
I used the api-platform client generator for quasar which generated the filter form with the q-input and q-date like this
<q-input filled v-model="item.createdAt[before]" :label="$t('createdAt[before]')" class="col-12 col-md"> <template v-slot:prepend> <q-icon name="event" class="cursor-pointer"> <q-popup-proxy transition-show="scale" transition-hide="scale"> <q-date v-model="item.createdAt[before]" mask="YYYY-MM-DD HH:mm" /> </q-popup-proxy> </q-icon> </template> <template v-slot:append> <q-icon name="access_time" class="cursor-pointer"> <q-popup-proxy transition-show="scale" transition-hide="scale"> <q-time v-model="item.createdAt[before]" mask="YYYY-MM-DD HH:mm" format24h /> </q-popup-proxy> </q-icon> </template> </q-input>
but obviously Vue see’s this as an error as it thinks the property ‘before’ isn’t declared, but ‘before’ isn’t a property it is part of the name createdAt[before]
I have tried using q-date with range but as it sets from and to api-platform ignores it as it wants ‘before’ and ‘after’ and not ‘to’ & ‘from’
any pointers would be most appreciated
-
@tempest try with
v-model="item['createdAt[before]']"
, but imo you could just parse/change it in the client side before using it, that sort of property naming is problematic with the square brackets. -
@metalsadman OMG that simple, thank you so much!!!
I’ve been banging my head on a wall for days trying to figure this out,
I totally agree formatting before passing, or even better to have 2 separate fields (searchFrom and searchTo) in the restapi, but as I’m new to the whole vue/quasar and api-platform, the client generator has helped me get a good head start (whilst learning) building our new customer portal, the old code, in appcelerator and using FrapiAPI, is so outdated it’s hilarious, and I’m loving Quasar, and so is my customers
Thank you again