Laravel vue.js中未定义的道具

Laravel vue.js中未定义的道具,laravel,vue.js,inertiajs,Laravel,Vue.js,Inertiajs,我正在学习使用stackInerty.js和vuejs 3的Laravel Jetstream 现在我想进行动态数据分页,这是我的组件: 用户控制器 父组件 子组件 导出默认值{ 道具:{ 链接:数组, }, }; 不幸的是,我遇到了一个错误,$props.links未定义,我不知道为什么会出现这个错误 有人能帮我解决这个问题吗? 谢谢提供的代码似乎正确,因此我们需要更多的代码。您的用户链接在哪里?在尝试使用它之前,请确保它已定义。控制台中有错误吗?@tauzN当我在控制台中看到数据用户

我正在学习使用stack
Inerty.js和
vuejs 3
的Laravel Jetstream

现在我想进行动态数据分页,这是我的组件:

用户控制器

父组件


子组件


导出默认值{
道具:{
链接:数组,
},
};
不幸的是,我遇到了一个错误,
$props.links未定义,我不知道为什么会出现这个错误
有人能帮我解决这个问题吗?

谢谢

提供的代码似乎正确,因此我们需要更多的代码。您的
用户链接在哪里?在尝试使用它之前,请确保它已定义。控制台中有错误吗?@tauzN当我在控制台中看到数据用户时,我没有定义。
public function filter(Request $request)
{
    return Inertia::render('Users/Index', [
        'filters' => $request->all('search', 'trashed'),
        'users' => User::orderByName()
                    ->filter($request->only('search', 'trashed'))
                    ->paginate()
                    ->transform(function ($user) {
                        return [
                            'id' => $user->id,
                            'username' => $user->username,
                            'name' => $user->name,
                            'profile_photo_url' => $user->profile_photo_url,
                            'email' => $user->email,
                            'created_at' => $user->created_at->diffForHumans(),
                        ];
                    }),
    ]);
}
<pagination class="mt-6" :links="users.links" />
<template>
    <div v-if="links.length > 3">
        <div class="flex flex-wrap -mb-1">
            <template v-for="(link, key) in links">
                <div
                    v-if="link.url === null"
                    :key="key"
                    class="mr-1 mb-1 px-4 py-3 text-sm leading-4 text-gray-400 border rounded"
                    v-html="link.label"
                />
                <inertia-link
                    v-else
                    :key="key"
                    class="mr-1 mb-1 px-4 py-3 text-sm leading-4 border rounded hover:bg-white focus:border-indigo-500 focus:text-indigo-500"
                    :class="{ 'bg-white': link.active }"
                    :href="link.url"
                    v-html="link.label"
                />
            </template>
        </div>
    </div>
</template>

<script>
export default {
    props: {
        links: Array,
    },
};
</script>