vue-cli build переписывает "this" и заставляет реквизиты быть неопределенными

Question

У меня есть приложение vue, которое я хочу построить как компонент, чтобы я мог использовать его в другом приложении (не vue).

Я использую vue-cli для сборки: vue-cli-service build --target wc --name my-component 'src/App.vue'

У меня две проблемы:

1. Когда vue-cli компилирует код, я заметил, что «this» меняется:

В моем исходном коде метод поиска не использует function, поэтому он не перезаписывается.

    search(id) {
     // this is not overwritten
    console.log(this.myProp)

Вот та же функция в скомпилированной сборке:

Обратите внимание, что они кэшировали это с: var _this = this, однако все мои ссылки на this не изменены на _this!

Я сумасшедший или это не большая проблема? Из-за этого мне приходится делать грязные обходные пути, чтобы заставить мой код работать.

в тупик: \

Answer 1

Попробуйте использовать функцию стрелки для захвата this.

search: (id)=> {
     // this is not overwritten
    console.log(this.myProp)
}