Vue3 全域性 Api 與 v model 的使用

2021-10-10 22:11:28 字數 1320 閱讀 1817

vue2 中的 global api 在 vue3 中 改為 應用程式例項呼叫,如自定義元件

// vue2 使用 vue.component 方式

import vue from

"vue";;

vue.

component

(;

import

from

"vue";;

.component

("comp",)

;

同時部分 api 改為了可搖數優化,打包時使用 webpack 的 tree-shaking 排除多餘的 dead code (無效**)。

// vue2

import vue from

"vue"

;vue.

nexttick((

)=>

);

// vue3

import

from

"vue"

;nexttick((

)=>

);

在 vue3 中 移除了 .sync 修飾符,v-model 實現元件雙向資料繫結 的用法如下:

<

!-- v-model 的使用 --

>

"counter"

/>

<

!-- 與 v-model 等效 --

>

"counter" @update:counter=

"counter = $event"

/>

<

/template>

import vmodeltest from

"./vmodeltest.vue"

;export

default;}

, components:,}

<

/script>

<

!-- vmodeltest 元件 --

>

"$emit('update:counter', counter + 1)"

>

counter:

}<

/div>

<

/template>

export

default,}

,};<

/script>

Vue3學習與實踐 全域性異常監控

每個web專案上線後,難免會出現各種奇奇怪怪的bug,或網路,或系統無法,或相容適配,或測試遺漏等等原因。為了能更快的定位問題,解決問題,所以新增前端異常監控至關重要。本文就具體介紹一下怎麼在vue3專案中配置全域性異常監控。在vue專案中,錯誤異常監控可從以下三個方法入手 特點 語法 window...

vue3的新特性及api

1.響應式原理 vue2的響應式原理是利用object.defineproperty而vue3則是利用proxy。proxy的效能和功能比object.defineproperty強很多 這裡的強是指api支援更好原始碼層次 可以看一下這邊文章proxy 與object.defineproperty...

vue3新特性及api介紹(二)

接上文的介紹。vue3新特性位址戳我 vue3api介紹位址戳我 7.provide inject 用法和之前類似,不過只能在setup函式內使用 const prokey symbol provide provide prokey,aaa inject prokey,123 inject的第二個引...