1. 程式人生 > >vue-cli元件配置與使用(建立一個公用元件)

vue-cli元件配置與使用(建立一個公用元件)

這次給大家帶來vue-cli元件配置與使用,vue-cli元件配置與使用的注意事項有哪些,下面就是實戰案例,一起來看一下。

概述:

一個檔案就是一個模組,需要引入模組,和暴露模組的方法

在一個元件中使用另一個元件三部曲:引入元件、註冊元件、使用元件

1.main.js檔案解讀

.是整個專案的入口檔案,在src資料夾下
.import(es6)引入vue和根元件app.vue
.最後new Vue,啟動應用

2、元件的使用

.定義的元件一般放到components目錄下
.用一個元件的過程

a .被引用的檔案暴露物件(如果元件中沒有script,可以不需要暴露)

b. 父元件引入子元件,註冊元件(全域性元件不需要引入),使用元件

擴充套件:import

import OO from XX

1.import相當於var、let去宣告一個變數OO(自定義,解構賦值都可以)

2.from:引入哪個檔案

.如果是自己定義的檔案,一定要寫相對路徑‘./'
.如果引入node——modules下的檔案不需要寫

import 變數 from ‘模組路徑
import {解構賦值} from ‘模組路徑
import {* as 變數} from ‘模組路徑

3.此時OO返回一個物件

4.如果希望物件中有內容,需要XX先暴露出物件,這樣OO才能接收到並在當前檔案使用。根據暴露物件的格式,決定接手變數的格式

.暴露多個物件,通過解構賦值接收

.暴露多個物件,通過一個變數接收

原文連結:http://www.php.cn/js-tutorial-394750.html