動態元件
通過使用保留的元素，動態的繫結到它的is特性，我們讓多個元件同時使用同乙個掛載點，並動態切換：
var vm = new vue(,
components: ,
posts: ,
archive: }})
component>
也可以直接繫結到元件物件上：
var home =
var vm = new vue(
})keep-alive
如果把切換出去的元件保留在記憶體中，可以保留它的狀態或避免重新渲染。為此可以重新新增乙個keep-alive指令引數：
component>
keep-alive>
雜項
編寫可復用元件
在編寫元件時，留意是否要復用元件是有好處的。一次性元件跟其他元件緊密耦合是沒關係的。
但是可復用元件應當定義乙個清晰的公開介面。
vue元件的api來自三部分：props ,events和slots:
1.props允許外部環境傳遞資料給元件。
2.events允許從外部環境在元件內觸發***。
3.slots允許外部環境將額外的內容組合在元件中。
使用v-bind和v-on的簡寫語法，模板的縮排清楚且簡潔：
:foo="baz"
:bar="qux"
@event-a="dothis"
@event-b="dothat"
>
hello!p>
my-component>
子元件索引
儘管有props和events，但是有時仍然需要在j**ascript中直接訪問子元件，為此可以使用ref為子元件指定乙個索引id，例如：
user-profile>
div>
var parent = new vue()
// 訪問子元件
var child = parent.$refs.profile
當ref和v-for一起使用時，ref是乙個陣列，包含相應的子元件。
注：$refs只在元件渲染完成後才填充，並且它是非響應式的。它僅僅作為乙個直接訪問子元件的應急方案--應當避免在模板或計算屬性中使用$refs.
非同步元件
vue.component('async-example',function(reslove,reject))
},1000);
})vue.component('async-webpack-example', function (resolve) )
你可以使用 webpack 2 + es2015 的語法返回乙個promiseresolve 函式：
vue.component(
'async-webpack-example',
() => import('./my-async-component')
)當使用區域性註冊時，你也可以直接提供乙個返回promise 函式。
new vue(
})如果你是browserify使用者，可能就無法使用非同步元件了，它的作者已經表明browserify是不支援非同步載入的。browserify社群發現一些解決方法，可能有助於已存在的複雜應用。對於其他場景，我們推薦簡單實用 webpack 構建，一流的非同步支援。
vue動態元件 非同步元件
重新建立動態元件的行為通常是非常有用的，但是在這個案例中，我們更希望那些標籤的元件例項能夠被在它們第一次被建立的時候快取下來。為了解決這個問題，我們可以用乙個元素將其動態元件包裹起來。v bind is currenttabcomponent component keep alive 注意 這個要求...
Vue 動態元件
vue.js提供了乙個特殊的元素用來動態掛載不同的元件，使用is特性來選擇要掛載的元件 is current component click change a 切換到a元件button click change b 切換到b元件button click change c 切換到c元件button d...
vue 動態元件
看例子 one component div js 部分 newvue two thr 上面 註冊了三個元件，在 component 標籤裡有個屬性 is，is one，所以頁面會渲染名字叫 one 的元件，顯示結果如下 我是線路一 如果給 is 屬性繫結動態值，那麼就可以實現元件的動態切換，例子如下...