Я работаю с популярным компонентом vue-select для проекта VueJs. Я хочу настроить keyDownEvent и просмотрел документы, чтобы узнать, как этого добиться. Меня встретил загадочный пример с использованием комбинации современных методов JS.
<template>
<v-select
taggable
multiple
no-drop
:map-keydown="handlers"
placeholder="enter an email"
/>
</template>
<script>
export default {
name: 'CustomHandlers',
data: {
variableIwantAccessTo: []
},
methods: {
handlers: (map, vm) => ({
...map, 50: e => {
e.preventDefault();
if( e.key === '@' && vm.search.length > 0 ) {
vm.search = `${vm.search}@gmail.com`;
}
},
}),
},
};
</script>
Я понимаю простую логику блока if, но не понимаю комбинацию используемых методов, которая приводит к этому. Основная проблема, с которой я столкнулся в своей пользовательской реализации, — это потеря контекста для объекта this. Я хочу что-то вроде этого:
handlers: (map, vm) => ({
...map, 50: e => {
e.preventDefault();
if( e.key === '@' && vm.search.length > 0 ) {
console.log(this.variableIwantAccessTo);
}
},
Я не могу понять, как передать это с этой реализацией. Вот ссылка на документы: https://vue-select.org/guide/keydown.html#mapkeydown
