When add 1 the string should not is 01

Question

I am try add 1, but item.num is 01. How to add 1 input value is 1,2,3,4,5...? Note that num must be the string. Go the demo of jsfiddle.

Look at the gif:

Look at the image:

Note:`item.num += 1` do not need to modify!

I want the following effect:

Look at the javascript:

var app = new Vue({
  el: "#app",
  data: {
    list: [{
      id: "1",
      name: "demo01",
      num: "0"
    }],
    addnum: []
  },
  methods: {
    addClick(item) {
      console.log(this.addnum.push(item))
      item.num+=1
    },

  }
})

HTML file:

<div id="app">
  <ul>
    <li v-for="item in list">
      <p>{{item.name}}</p>
      <br>
      <input type="text" :value="item.num">
      <button @click="addClick(item)">+</button>
    </li>
  </ul>
</div>

Why not simply coercing first? Have a look here: https://jsfiddle.net/9knrb919/ Also, why a string in the first place? Just use a number: https://jsfiddle.net/pb9u3umh/ — Gerardo Furtado, Jan 24 '18 at 06:26
can you explain where these limitations come from? Why does this number have to be a string? And why can't you modify a simple line of code in your own component? In the current context and code, these requirements make no sense to me. — Thomas, Jan 24 '18 at 06:39
What exactly are you trying to achieve here? Your code seems really confusing. — Nabin Paudyal, Jan 24 '18 at 06:42

score 3 · Accepted Answer · answered Jan 24 '18 at 06:27

Hoping that you can at least add some code to addClick method, here's what to do:

addClick(item) {
      console.log(this.addnum.push(item))
      item.num = parseInt(item.num, 10)
      item.num+=1
      item.num = ""+item.num // converting back to string
    },