Пока до конца не понимаю, как лучше решить мою задачу, поэтому думаю о всяких странных вещах, вроде этой.
Хочу вынести некоторую логику в отдельный класс, но внутри этого скрипта мне нужно иметь доступ к v-model, точнее, мне нужно просто иметь ссылку на массив, привязанный к конкретному списку.
Кода как такового пока нет, поэтому вот псевдо:
// Vue
<template lang="pug">
.application
.items(v-model="array")
.item(v-for="item in array") {{ item }}
</template>
<script>
import SomeScript from '@/SomeScript'
const script = new SomeScript()
export default {
data() {
return {
array: [1, 2, 3, 4, 5, 6]
}
},
beforeDestroy() {
script.destroy()
}
}
</script>
// Class
class SomeScript {
constructor() {
this.init()
}
init() {
document.addEventListener('mousedown', this.mousedownHandler)
}
destroy() {
document.removeEventListener('mousedown', this.mousedownHandler)
}
mousedownHandler(event) {
const items = event.target.closest('.items')
// Вот тут хочу получить доступ к v-model
items['some-magic-to-get-access-to-data-array'].sort()
}
}
Не знаю, как точнее сформулировать вопрос, поэтому очень надеюсь, что суть ясна. Но повторюсь: хочу вынести логику отдельно от Vue, но при этом с доступом к свойствам его экземпляра. Я мог бы довольно легко сделать это плагином или просто компонентом, но вопрос именно в том, насколько возможно абстрагироваться от структуры Vue в данном случае.
Это делается по двум причинам: из интереса и для простоты миграции кода в другие проекты при необходимости (независимо от фреймворка).
