Блог

Я в основном пытаюсь создать какую-то динамическую таблицу, используя Vue в Laravel. Я успешно создал таблицу и получил данные с помощью $.getJSON метода jquery. Я действительно хочу иметь ссылку внутри таблицы, которая указывала бы на URL-адрес, используя route() метод Laravel, поскольку у меня есть много разных маршрутов, которые я хотел бы использовать.

Примером в этом случае является то, что таблица содержит список всех пользователей, и я хотел бы иметь ссылку view user для каждого пользователя. Но я не могу получить доступ к Laravel route() внутри компонента Vue.

Чтобы сделать это очень коротким вопросом: есть ли какой-либо способ получить доступ ко всем маршрутам, которые есть в Laravel, помимо добавления одного маршрута в поле атрибутов в шаблоне, например:

 <user-table-component dataRoute="{{ route('datatable.users') }}">
</user-table-component>
  

Я открыт для предложений относительно того, как я могу исправить это другим способом.
Кроме того, вот шаблон:

 <template>

    <table>
        <thead>
            <tr>
                <td v-for="header in json.headers" :key="header">{{ header }}</td>
            </tr>
        </thead>

        <tbody>
            <tr v-for="user in json.rows.data" :key="user">
                <td><a href="THIS WOULD BE AN VIEW USER LINK">{{ user.name }}</a></td>
                <td>{{ user.email }}</td>
                <td>{{ user.created_at }}</td>
            </tr>
        </tbody>
    </table>

</template>



<script>
    module.exports = {
        name: 'user-table-component',
        props: ['dataroute'],

        data: function(){
            return {
                json: []
            }
        },

        // This is auto-run when the Vue app is booted up
        mounted() {

            // Closure to accept component in the callback below
            var self = this;
            $.getJSON(this.dataroute, function(json) {
                self.json = json;
            });
        }
    }
</script>
  

Используйте это

 https://github.com/tighten/ziggy
  

Затем в Javascript вы можете использовать route('route.name')