mirror of
https://gitee.com/element-plus/element-plus.git
synced 2024-12-14 01:11:25 +08:00
e1add47603
* feat(hooks): add useAttrs hook * feat(hooks): undo binding class and style automatically * test: remove unused import statement
38 lines
931 B
TypeScript
38 lines
931 B
TypeScript
import {
|
|
getCurrentInstance,
|
|
reactive,
|
|
shallowRef,
|
|
watchEffect,
|
|
} from 'vue'
|
|
import { entries } from '@element-plus/utils/util'
|
|
|
|
const DEFAULT_EXCLUDE_KEYS = ['class', 'style']
|
|
const LISTENER_PREFIX = /^on[A-Z]/
|
|
|
|
export default (excludeListeners = false, excludeKeys: string[] = []) => {
|
|
const instance = getCurrentInstance()
|
|
const attrs = shallowRef({})
|
|
const allExcludeKeys = excludeKeys.concat(DEFAULT_EXCLUDE_KEYS)
|
|
|
|
// Since attrs are not reactive, make it reactive instead of doing in `onUpdated` hook for better performance
|
|
instance.attrs = reactive(instance.attrs)
|
|
|
|
watchEffect(() => {
|
|
const res = entries(instance.attrs)
|
|
.reduce((acm, [key, val]) => {
|
|
if (
|
|
!allExcludeKeys.includes(key) &&
|
|
!(excludeListeners && LISTENER_PREFIX.test(key))
|
|
) {
|
|
acm[key] = val
|
|
}
|
|
|
|
return acm
|
|
}, {})
|
|
|
|
attrs.value = res
|
|
})
|
|
|
|
return attrs
|
|
}
|