本文實(shí)例講述了vue組件定義，全局、局部組件，配合模板及動(dòng)態(tài)組件功能。分享給大家供大家參考，具體如下：

目前成都創(chuàng)新互聯(lián)已為近1000家的企業(yè)提供了網(wǎng)站建設(shè)、域名、虛擬主機(jī)、網(wǎng)站托管維護(hù)、企業(yè)網(wǎng)站設(shè)計(jì)、大廠網(wǎng)站維護(hù)等服務(wù)，公司將堅(jiān)持客戶導(dǎo)向、應(yīng)用為本的策略，正道將秉承"和諧、參與、激情"的文化，與客戶和合作伙伴齊心協(xié)力一起成長，共同發(fā)展。

一、定義一個(gè)組件

定義一個(gè)組件:

1. 全局組件

var Aaa=Vue.extend({
 template:'
我是標(biāo)題3
'
});
Vue.component('aaa',Aaa);

*組件里面放數(shù)據(jù):

data必須是函數(shù)的形式，函數(shù)必須返回一個(gè)對(duì)象(json)

2. 局部組件

放到某個(gè)組件內(nèi)部

var vm=new Vue({
 el:'#box',
 data:{
  bSign:true
 },
 components:{ //局部組件
  aaa:Aaa
 }
});

1. 全局組件

組件里面放數(shù)據(jù)：

2. 局部組件

放到某個(gè)組件內(nèi)部

另外一種寫法，局部

二、配合模板

配合模板:

1. template:'

標(biāo)題2->{{msg}}

2. 單獨(dú)放到某個(gè)地方

a).

b).

方法一：

方法二：

三、動(dòng)態(tài)組件

動(dòng)態(tài)組件:

運(yùn)行效果：

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具：http://tools.jb51.net/code/HtmlJsRun測(cè)試上述代碼運(yùn)行效果。

希望本文所述對(duì)大家vue.js程序設(shè)計(jì)有所幫助。