Vue元件的註冊

1、短橫線分隔（ kebab-case）

vue.

component
('my-component-name'
,)

2、帕斯卡命名方式（pascalcase）

vue.

component
('mycomponentname'
,)

（2）注意：直接在 dom (即非字串的模板) 中使用時只有 kebab-case 是有效的。

vue元件在全域性註冊之後可以用在任何新建立的 vue 根例項 (new vue) 的模板中，全域性註冊元件使用 vue.component()方法。

1、**內部嵌入

（1）通過vue.extend()和vue.component()註冊

//建立元件構造器物件

var tmp1 = vue.
extend()
;//註冊元件
vue.
component
("my-tmp1"
, tmp1)
;//第乙個引數是自定義名稱，第二個引數是元件名稱

//第乙個引數是自定義名稱，第二個是元件例項

vue.
component
("my-tmp2"
, vue.
extend()
);

js部分：

vue.

component
("my-t***",)
;

"te***"

>
/h4>
<
/template>

（1）先定義乙個元件zj.vue

//html模板部分

你好lhj！<
/h1>
<
/template>
//js**部分
export default
<
/script>
//css樣式部分
<
/style>

import zj from "./components/zj"

vue.

component
("zj"
,zj)

1、**內部嵌入

export default},

components:
,"temp6":}
})

<
/temp5>
<
/div>

(1)在需要的頁面內匯入已經定義好的元件zj.vue

import zj from "./components/zj"

export default},

components:
})

<
/temp7>
<
/div>

components:

//不自定義元件的名字

<
/zj>
<
/div>

Vue元件註冊

方式一 vue.component my component name 方式二 vue.component mycomponentname 方式一 在dom中可以直接用，是有效的元素 方式二 可用在單檔案元件中 single file component 元件註冊後，可在全域性使用，並且全域性元件之...

vue元件註冊

我們會在多個頁面使用button，每個頁面寫起來很麻煩，如果想把它做成乙個公用元件，使用時直接呼叫會比較方便。現在建立了乙個元件button.vue。找到main.js檔案，然後輸入如下 import button from components button.vue vue.component m...

Vue 元件註冊

全域性元件 全域性元件註冊語法 components中的兩個引數元件名稱和元件內容 vue.component 元件名稱,全域性元件註冊應用 元件建立 vue.component button counter template 點選了 次 methods var vm new vue 如何在頁面中運...