dynamic component is vs :is

I was trying to implement dynamic component as explained here: http://vuejs.org/guide/components.html#Dynamic-Components

Not sure if it’s a problem with the documentation or a bug but the example in the documentation does not work, had to remove the colon in front of :is to get it working

Vue.js version

1.0.26 (developement)

What is Expected?

Using <component :is="..."> didnt work as the documentation explains

What is actually happening?

<component is="..."> (is instead of :is) worked

[LinusBorg]

@mikekidder I don’t think that it makes sense to explain this for the is attribute specifically - it works just like any other prop in Vue.

We have documented how to use props as well as common pitfalls throughout the documentation, e.g. here: http://vuejs.org/guide/components.html#Literal-vs-Dynamic

[LinusBorg]

Ok I see, but is without colon is not explained in the doc, I think it should because it’s the behavior I was looking for

To be fair, the general behaviour of props with a leading colon is explained in the docs, in the chapter about Data Binding Syntax and their shortcuts: http://vuejs.org/guide/syntax.html#v-bind-Shorthand

But I can see how that is not obvious to someone scanning the docs for a specific topic.

I therefore think we should try and change docs to use the longhand version for all bindings (v-bind:prop-name="expression").

So the example would then look like this:

<component v-bind:is="currentView">
  <!-- component changes when vm.currentview changes! -->
</component>

Which would tell someone new to Vue that he/she has to look up v-bind in order to fully get what is going on.