0

我正在开始一个新项目,但我不确定为什么我的 vue devtools 中的道具是空的?关于我登录的用户的信息在哪里?我是否必须在某个地方设置该选项?

这是我的 app.js

import { InertiaApp } from '@inertiajs/inertia-vue'
import Vue from 'vue'
import ElementUI from 'element-ui'
import lang from 'element-ui/lib/locale/lang/es'
import 'element-ui/lib/theme-chalk/reset.css'
import locale from 'element-ui/lib/locale'

locale.use(lang);
Vue.use(InertiaApp);
Vue.use(ElementUI);


const app = document.getElementById('app');
app.setAttribute(':class',"{'loaded': loaded}");
new Vue({
    render: h => h(InertiaApp, {
        props: {
            initialPage: JSON.parse(app.dataset.page),
            resolveComponent: name => import(`@/Pages/${name}`).then(module => module.default),
        },
        data(){
            return{
                loaded:true
            }
        }
    }),
}).$mount(app);

这是我的 webpack.mis.js

const mix = require('laravel-mix');
const path = require('path');

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css')
    .webpackConfig({
        output: { chunkFilename: 'js/[name].js?id=[chunkhash]' },
        resolve: {
            alias: {
                vue$: 'vue/dist/vue.runtime.esm.js',
                '@': path.resolve('resources/js'),
            },
        },
    })
    .babelConfig({
        plugins: ['@babel/plugin-syntax-dynamic-import'],
    })
    .version();

我的错误在哪里?

4

1 回答 1

1

处理经过身份验证的用户的一种方法是将登录用户作为道具共享。

一种快速的方法是转到您的AppServiceProvider.php文件并将以下内容添加到您的register()方法中。

Inertia::share('auth.user', function () {
    if (Auth::user()) {
        return [
            'id' => Auth::user()->id,
            'first_name' => Auth::user()->first_name,
            'last_name' => Auth::user()->last_name,
        ];
    }
});

访问数据是通过$page变量完成的。

<template>
    <p>{{ $page.auth.user.first_name }}</p>
</template>
于 2019-11-19T14:46:16.860 回答