`v-for` directive with integer range does not work with constant attribute but only works with binding

I was confused by some strange behaviour related to the v-for directive (Vue 2.5) with integer ranges and I ended up posting this stackoverflow question about it. The question was promptly answered and I now understand my mistake but I think that this behaviour is either a bug or a failure in the documentation and so I am opening this issue anyway.

Brief Summary

Here is a component:

let CounterComponent = Vue.extend({
    template: `
        <div>
            <h3>The counter is {{value}}</h3>
            <svg v-for="n in value" :key="n"
                 xmlns="http://www.w3.org/2000/svg" version="1.1"
                 xmlns:xlink="http://www.w3.org/1999/xlink"
                 viewBox="0 0 10 10">
                <circle cx="5" cy="5" r="5"></circle>
            </svg>
        </div>
    `,
    props: {
        value: Number
    }
})

Note the use of the v-for directive with an integer range bound to the value property.

If you use a v-for as in this jsfiddle, it doesn’t work at all:

<counter-component value="14" />

However, the following both work: jsfiddle, jsfiddle

<counter-component v-bind:value="15" />
<counter-component :value="16" />

Source of Great Confusion™

I was fooled by the fact that the interpolation in the h3 tag works in all three cases but the v-for directive only works in the latter two. I wasted hours trying various variants of the syntax because, while I will certainly use a binding in a live application, I was trying out the integer-range support in the v-for directive for the first time and had plonked multiple instances of the component I was building onto a page with different values of the value property, all set as constants.

Suggested Resolution

I propose that either v-for is changed so that it works in all three cases or that the documentation (https://vuejs.org/v2/guide/list.html#v-for-with-a-Range) is updated to reflect this requirement that, if a component property is used as the range parameter, that property cannot be set to a literal and must be bound.

I am not sure how to phrase the latter but I guess that simply updating the docs would be the responsible course of action.

[yyx990803]

A literal prop is passed down as a string, not a number.

[yyx990803]

You did not get a warning because it is technically possible to iterate over a string with v-for as well.