關於vue中ref的使用方法

2022-07-16 21:51:19 字數 526 閱讀 3044

之前在專案中會通過ref在父子元件傳遞一些資料,但是具體ref的其他用法並沒有深究,所以來了解一下ref的具體使用方法

first:

ref="

hello

">

//在方法或者生命週期的函式中獲取資料

console.log(this.$refs.hello.innertext);
second:

components://註冊子元件

ref="

node

">111222

//在表單中使用子元件並在子元件上使用ref

console.log(this

.$refs.node);

//在方法中通過refs獲取子元件的方法和屬性

這是獲取整個子元件的內容

Vue中ref的使用

在沒有學習vue之前,我們實現直接操作頁面上的dom元素都是通過js jquery,因為jquery對dom元素的操作非常的方便。但是學習了vue之後,對dom的操作完全交給vm了,這個時候手動的獲取dom元素再使用js jquery就沒有那麼方便。於是出現了ref,即ref的功能之一就是獲取dom...

vue中mixins的使用方法

參考官網以及網上的一些資料,最基本的用法 混入 mixin 提供了一種非常靈活的方式,來分發 vue 元件中的可復用功能。乙個混入物件可以包含任意元件選項。當元件使用混入物件時,所有混入物件的選項將被 混合 進入該元件本身的選項。mixins就是定義一部分公共的方法或者計算屬性,然後混入到各個元件中...

Vue 中 attrs 中的使用方法

vue官網是這樣介紹的 包含了父作用域中不作為 prop 被識別 且獲取 的特性繫結 class和style除外 當乙個元件沒有宣告任何 prop 時,這裡會包含所有父作用域的繫結 class和style除外 並且可以通過v bind attrs 傳入內部元件 在建立高階別的元件時非常有用。a ms...