动态组件 · vue

# 动态组件使用 is attribute使用方法 ``` <component :is="currentCom"></component>  ``` ## 代码如下： ~~~ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="app"> <span @click="changCom('coma')">标签a</span>  <span @click="changCom('comb')">标签b</span> <span @click="changCom('comc')">标签c</span> <component :is="currentCom"></component>  </div> </body> </html> <script src="vue/vue.js"></script> <script> coma={ //创建一个组件 template:`<p>this is coma</p>` //组件 A } comb={ //创建一个组件 template:`<p>this is coma</p>` //组件 B } comc={ //创建一个组件 template:`<p>this is comc</p>` //组件 C } var vm=new Vue({ el:'#app', data:{ currentCom:'coma' //动态v- }, components:{ 'coma':coma, //注册组件到父类 'comb':comb, 'comc':comc, }, methods:{ changCom:function (data){ this.currentCom=data //点击获取替换组件 } } }) </script> ~~~