Inertia.js Vue 파일 내의 Laravel의 .env 변수 접근

Inertia.js Vue 파일 내의 Laravel의 .env 변수 접근

먼저 이너시아 라라벨의 예를 들어보겠습니다.https://github.com/drehimself/inertia-example

이너시아를 사용하는 단일 코드베이스에서 Vue를 사용하는 Larabel에 불과합니다.js: https://github.com/inertiajs/inertia-laravel https://github.com/inertiajs/inertia-vue

.vue 컴포넌트 파일 내의 Laravel의 .env 변수에 액세스하려고 합니다.

.env 파일:

APP_NAME=ABC

app\Providers\AppServiceProvider에서 선택합니다.php:

public function register()
{
    Inertia::share('appName', env('APP_NAME'));
}

리소스\js\Home.vue 컴포넌트:

<template>
  <div>
        <span class="tw-text-left">{{ appName }}</span>
  </div>
</template>

<script>
export default {
  props: [
    "appName",
 ]
}
</script>

vue 콘솔에 appName이 비어 있습니다.ABC라고 표시되어야 하는데 표시되지 않습니다.여기서 무슨 일이 일어나고 있는 거죠?또한 모든 환경변수에 액세스하려면 어떻게 해야 할까요?컨트롤러를 통하지 않고 모든 환경변수에 액세스 할 수 있을까요?효율이 그다지 높지 않은 것 같습니다.

드디어 작동했어요.관심 있는 분들을 위한 방법은 다음과 같습니다.AppServiceProvider:

        Inertia::share(function () {
            return [
                'app' => [
                    'name' => config('app.name'),
                ],
            ];
        });

vue 파일에서:

<template>
<div>
App name: {{ $page.app.name }}
</div>
</template>

2부는 제가 놓쳤던 부분이에요.저는 app.name의 소품을 받아들이려고 했는데 $page를 놓쳤습니다.이게 도움이 됐으면 좋겠네요!

오래된 일이라는 것은 알지만, 같은 문제에 부딪혔고, 인터넷 상기와 그 주변의 방법은 나에게 효과가 없었습니다.관성 때문에 뭔가 변한 것 같아?어쨌든, 작동은 했어요.

위와 같이 AppServiceProvider 내의 등록 메서드에 다음을 추가합니다.

Inertia::share('appName', config('app.name'));
// I'm using config, but your could use env

그런 다음 Vue 컴포넌트에서$inertia다음과 같은 변수:

{{ $inertia.page.props.appName }}

작성자 웹사이트의 설명서에서 vue에게 주입을 지시해야 합니다.page공유 변수에 액세스할 수 있습니다.

예를 들어 다음과 같습니다.

<template>
  <div>
        <span class="tw-text-left">{{ page.props.appName }}</span>
  </div>
</template>

<script>
export default {
  inject: ['page'],
  // ...
}
</script>

여러 변수를 보기에서 공유하려면 다음을 사용합니다.

Inertia::share('app', [
        'name' => config('app.name'),
        'url' => config('app.url'),
    ]);

언급URL : https://stackoverflow.com/questions/57194840/accessing-laravels-env-variables-inside-inertia-js-vue-files