This page looks best with JavaScript enabled

Type cast in style in a Vue component

 ·   ·  ☕ 1 min read

Do you type cast in Vue? Of course you do. So, is there a way to just not use Javascript shortcuts since they are so cumbersome?

Really?

You find this cumbersome?

1
2
let myNumStr = +myNum;
let myStrNum = "" + myStr;

See more at type casting in Javascript and shortcuts to type cast.

Regardless of your opinion, with Vue you now have the option to see more.. options.

See below -

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
<template>
  <input v-model.number="position" type="number" />
</template>
<script>
  export default {
    data() {
      return {
        position: 0
      };
    }
  };
</script>

Bad news if you wanted to go overboard with this - number is literally the only thing supported here. So, back to the cumbersome Javascript type conversions for rest of the use cases.

Also see

Stay in touch!
Share on

Prashanth Krishnamurthy
WRITTEN BY
Prashanth Krishnamurthy
Technologist | Creator of Things