Использование Vue в Laravel Spark - «метод не определен в экземпляре» с использованием vue2-touch-events - что я могу сделать по-другому?

Question

Я пытаюсь создать очень простое приложение, похожее на трут, используя Laravel Spark и vue2-touch-events. Я предполагаю, что делаю что-то необычайно глупое, поэтому я ценю ваше понимание.

Я получаю это предупреждение в моем Vue инспекторе:

[Vue warn]: Property or Метод "swipeHandler" не определен в экземпляре, но на него ссылаются во время рендеринга. Убедитесь, что это свойство является реактивным, либо в параметре данных, либо для компонентов на основе классов, инициализируя свойство.

Вот моя простая версия всего соответствующего кода. Я изменил v-touch: проведите пальцем по лонгтапу для тестирования.

/ resources / js / app. js:

require('spark-bootstrap');

require('./components/bootstrap');

require('vue2-touch-events');

Vue.component('swipeHandler', './components/swipehandler.vue');

var app = new Vue({
    mixins: [require('spark')],
    components: {
        vue2touchevents,
        swipeHandler
    },
});

swipe.blade. php:

@extends('spark::layouts.app')

@section('content')
<home :user="user" inline-template>
    <div class="container">
        <div class="row justify-content-center flex-column-reverse flex-md-row">
            <div class="col-md-8">
                <div class="card text-center">
                    <div class="card-header">
                        <div><i v-touch:longtap="swipeHandler">Swipe Here</i></div>
                   </div>
                </div>
            </div>
        </div>
    </div>
</home>
@endsection

/ resources / js / components / swipehandler. vue:

<script>
export default {
    methods: {
        swipeHandler () {
            alert("yay!");
            console.log("yay!");
        }
    }
}
</script>

Answer 1

По моему мнению, вы можете попробовать добавить шаблон в ваш /resources/js/components/swipehandler.vue компонент:

<template>
    <div>Yay</div>
</template>

<script>
export default {
    methods: {
        swipeHandler () {
            alert("yay!");
            console.log("yay!");
        }
    }
}
</script>

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

Удачи.