Vuejs无法提交表单Ajax

I want to submit data via modal Semantic UI and Vuejs. But my form cannot submit data via Ajax. i'm tired to find the problem, maybe someone can help me.

My View like this.

<form v-on:submit.prevent="addProductCategory" class="ui form">
        <div class="content">
            <div class="description">
                <div class="field" v-bind:class="{'has-error': input.errorsAddProductCategory.name}">
                    <label for="name">Name</label>
                    <input v-model="input.addProductCategory.name" type="text" id="name" name="name">
                    <div class="help-block" v-if="input.errorsAddProductCategory.name"
                         v-text="input.errorsAddProductCategory.name[0]"></div>
                </div>
            </div>
        </div>
        <div class="actions">
            <div class="ui black deny button">
            No
            </div>
            <button type="submit" class="ui positive right button">Add</button>
        </div>
    </form>
<script type="text/javascript">
    const CSRF_TOKEN = '{{ csrf_token() }}';
    const URLS = {
        productCategory: {
            addProductCategory: '{{ route('product-category.store') }}',
        }
    };
</script>

Function to Add Data.

function addProductCategory() {
var data = app.input.addProductCategory;
data._token = CSRF_TOKEN;

$.ajax({
    url: URLS.productCategory.addProductCategory,
    method: 'POST',
    data: data,
    success: function (data) {
        app.input.addProductCategory = {
            name: ""
        };
        app.input.errorsAddProductCategory = [];

        $('#modal-create').modal('hide');
    }
    error: function (data) {
        if (data.status === 401) { // unauthorized
            window.location.reload();
        } else if (data.status === 422) {
            app.input.errorsAddProductCategory = data.responseJSON;
        } else {
            alert('There is an error.');
            console.log(data);
        }
    }
});
}

And Vuejs

var app = new Vue({
el: "#app",
data: function () {
    return {
        input: {
            addProductCategory: {
                name: ""
            },
            errorsAddProductCategory: [],
            editProductCategory: {
                name: ""
            },
            errorsEditProductCategory: []
        }
    };
},
methods: {
    addProductCategory: addProductCategory,
}
});