vue檔案是如何被引用載入

2021-10-21 04:48:07 字數 3007 閱讀 8936

1.2 vue檔案引用

在沒接觸vue教程時,比較好奇vue檔案是如何被引用的,後來系統地學習了一遍,雖然當時明白了,但還是記錄下,畢竟好記性不如爛筆頭

例子demo

<

/header>

="article_list"

>

<

/li>

<

/ul>

<

/div>

<

/footer>

<

/div>

<

/template>

import header from

'../components/header.vue'

import footer from

'../components/footer.vue'

export

default

,data()

},created()

, methods:)}

}}<

/script>

.article_list

<

/style>

*.vue檔案稱為vue元件

首先,乙個vue元件,它的template則代表它的html結構。但是需要注意的是,不是說把**包裹在中就可以了,而是必須在裡面放置乙個html標籤來包裹所有的**。

大家看到這個**的時候肯定很奇怪,這是個什麼玩意兒。其實,這是乙個自定義元件。我們在其他地方寫好了乙個元件,然後就可以用這種方式引入進來。同樣也是乙個元件。

首先,需要兩個自定義元件,先引用進來。如下格式,比較好理解吧

import header from

'../components/header.vue'

import footer from

'../components/footer.vue'

其次,除了引用的檔案,我們將所有的**包裹於如下的**中間:

export

default

我們先引入了headerfooter這兩個元件的原始檔,接下來,我們要把引用的元件給申明到components裡面去。這樣,我們就可以在template裡面使用了。

components:

,

data是元件的資料。演示**,給了乙個list的空陣列資料。在template中,可以使用this.list來使用我們的資料

data()

},

created表示當我們的元件載入完成時,需要執行的內容。比如這裡,就讓元件在載入完成時,執行乙個叫this.getdata()的函式。另外createdvuejs中的勾子函式之一

created()

,

methods是我們的這個元件的方法,也可以說是函式。比如,上面的**就表示,我們的元件自定義了乙個叫getdata()的方法函式

methods:)}

}

這裡比較簡單,就是針對元件的template裡內容出現的html元素寫一些樣式。如下**:

vue檔案引用步驟:

html中運用元件

>

>

>

src=

"build.js"

>

script

>

body

>

import vue from

'vue'

//引入之後就可以直接new vue()使用了

//引入主元件

newvue(}

);

welcome vue<

/h1>

"change"

>

}<

/h2>

<

/my-menu>

<

!-- 引用的其他元件,然後在html中運用 --

>

<

/template>

import menu from

'./components/menu.vue'

//在此引入其他子元件

export

default},

methods:},

components:

}<

/script>

body

<

/style>

在當前目錄的components資料夾下面有乙個menu.vue元件

111<

/li>

111<

/li>

111<

/li>

<

/ul>

<

/template>

<

/script>

CLR是如何被載入並工作的

當執行windows應用程式的時候,clr總是默默地為服務著。clr到底是如何被載入並執行呢?首先,microsoft專門為clr定義了乙個標準的com介面。安裝某個版本的.net framework,clr被包含在dll中,作為com伺服器在windows登錄檔中註冊。一台電腦上可能安裝多個版本的...

Spring是如何載入Xml檔案的

這是乙個很有意思的話題,在我剛學習spring框架的時候是使用junit測試配置的datasource是否配置成功,那時候要寫一段這樣的 來載入我們配置好的xml檔案 test public void loadxml 當然我們現在很少使用這種方式手動去載入乙個xml檔案了,現在大部分的spring專...

web xml被檔案載入過程

1.啟動乙個web專案的時候,容器 如 tomcat 會去讀它的配置檔案web.xml.讀兩個節點 和 2.緊接著,容器建立乙個servletcontext 上下文 這個web專案所有部分都將共享這個上下文.3.容器將轉化為鍵值對,並交給servletcontext.4.容器建立中的類例項,即建立監...