Any experience with vue-autonumeric and Quasar?
-
I have experimented with v-money, a component/directive to help with input of currency and decimal numbers. There is a sample for it in the Quasar docs.
And I had great difficulties with it in my tests, because it seems to convert all null values to 0.0 numbers or “0.0” strings, which means you cannot distinguish them from null values any more. Maybe I got it wrong, but in addition, it turns out that v-money is no longer maintained.
There is an alternative package vue-autonumeric on NPM which seems to have better support, https://www.npmjs.com/package/vue-autonumeric
With v-money you can wrap their <money> component into the control v-slot of a Quasar q-field (sample code in Quasar docs on https://quasar.dev/vue-components/input#Using-third-party-mask-processors ).
Does anyone know whether the same is possible with the <vue-autonumeric> component? Any experience or sample code?
-
Have you seen this? Not sure it solves your problem, but it might.
https://qdecimal.netlify.app/#/
Scott
-
@s-molinari: Thanks Scott. Yes, this QDecimal does probably what I need. I had seen it a while ago, but had decided to use v-money, because it had been officially “advertised” in the Quasar docs on https://quasar.dev/vue-components/input#Using-third-party-mask-processors
Now I found out that v-money (unless I did something terribly wrong in my adoption of it) has this ugly habit to convert all null values to decimal zeros, which is in conflict with the principles of my app. And it is no longer maintained. See https://github.com/vuejs-tips/v-money/issues/15 . Unfortunately I did not read this when I started to use it.
However, my initial tests with vue-autonumeric are very positive. It can be included in the same way into a q-field as v-money. It seems to have great support, and has a lot more options than v-money. So I’ll probably spend a day or so to replace all my uses of v-money with vue-autonumeric.
I would suggest we update the quasar docs in the above section with an example of how to include vue-autonumeric as a 3rd party component, very similar to the hint to v-money. I may open a doc PR for that (vaguely remember how to do it from another situation a year ago).
QDecimal as another potential alternative looks to be nicely integrated with Quasar. A sniff test with the first input field in the QDecimal demo however displays “0.0” after manual deletion of all field input, so it might have the same null issue as v-money, unless there is some option to influence it.
-
I opened a PR with an example how to use vue-autonumeric with Quasar: https://github.com/quasarframework/quasar/pull/8568
