小程序怎樣全局引用組件和局部引用組件？

在項(xiàng)目的根目錄中，鼠標(biāo)右鍵，創(chuàng)建 components -> test 文件夾。在新建的 components -> test 文件夾上，鼠標(biāo)右鍵，點(diǎn)擊“新建 Component”，鍵入組件的名稱之后回車，會自動生成組件對應(yīng)的 4 個文件，后綴名分別為 .js，.json， .wxml 和 .wxss。

為了保證目錄結(jié)構(gòu)的清晰，建議把不同的組件，存放到單獨(dú)目錄中，例如：

上圖中在頁面的 .json 配置文件中引用組件的方式，叫做“局部引用”。使用局部引用的示例代碼如下：

//在頁面的.json文件中，引入組件
{
   "usingComponents": {
     "my-test1": "/components/test1/test1"
    }
}

//在頁面的.wxml文件中，使用組件
<my-test1></my-test1>

在 app.json 全局配置文件中引用組件的方式，叫做“全局引用”。全局引用組件的示例代碼如下：

//在 app.json 文件中，引入組件
{
"pages"：[ /* 省略不必要的代碼 */ ]，
"window":{ /* 省略不必要的代碼 */ ]，
"usingComponents":{
  "my-test2": "/components/test2/test2"
 }
}

//在頁面的.wxml文件中，使用組件
<my-test2></my-test2>

我們可以根據(jù)組件的使用頻率和范圍，來選擇合適的引用方式，如果某組件在多個頁面中經(jīng)常被用到，建議進(jìn)行“全局引用”，如果某組件只在特定的頁面中被用到，建議進(jìn)行“局部引用”。

組件和頁面的區(qū)別

從表面來看，組件和頁面都是由 .js、.json、.wxml 和 .wxss 這四個文件組成的。但是，組件和頁面的 .js 與 .json 文件有明顯的不同：

組件的 .json 文件中需要聲明 "component": true 屬性。

組件的 .js 文件中調(diào)用的是 Component() 函數(shù)。

組件的事件處理函數(shù)需要定義到 methods 節(jié)點(diǎn)中。