Laavel8.70@json 디렉토리의 수정 버전, Js:from () 방법

전언

JS에서 PHP 변수를 사용할 수 있도록 json 형식으로 출력된 @json direction이 있지만, 그 수정판의 Js:from () 방법이 탄생했다고 할 수 있다.
@json이면 구성 요소와의 친화성이 좋지 않아서 탄생한 느낌을 해결하기 위해서요.
참조: #39389, #39460, bbf47d5

시용하다

그래서 바로 해볼게요.
Ver. 8.70 이후에 다시 설치하면 괜찮지만 그렇지 않으면 이후 버전이 업그레이드되면 다음과 같은 내용을 추가해 주십시오.
config/app.php
해봐, 웹 페이지.php로 다음과 같이 기술합니다.

return [

    'aliases' => [
        // ...

        'Js' => Illuminate\Support\Js::class,
    ],
];

, 홈페이지come.php는 다음과 같다.

Route::get('/', function () {
    $user = User::make(['name' => '与太郎']);

    return view('welcome', compact('user'));
});

출력(원본)은 다음과 같다.

<script>
    var person = @json($user);
    var person = {{ Js::from($user) }};
    var person = {!! Js::from($user) !!};

    console.log(person)
</script>

콘솔 화면은 다음과 같은 느낌으로 출력됩니다.

<script>
    var person = {"name":"\u4e0e\u592a\u90ce"};
    var person = JSON.parse('{\u0022name\u0022:\u0022\\u4e0e\\u592a\\u90ce\u0022}');
    var person = JSON.parse('{\u0022name\u0022:\u0022\\u4e0e\\u592a\\u90ce\u0022}');

    console.log(person)
</script>

이때 @json이든 Js:from()이든 정상적으로 동작할 수 있습니다.
Html able을 구현했기 때문에아니오, {{}을(를) 사용할 수 있습니다.

그리고요?

그럼, 문제는 여기서부터 시작합니다.
@json의 경우 구성 요소에 건네주면 컴파일하지 않는 문제가 있습니다.다음 구성 요소가 있다고 가정하십시오.
(Alpine.js의 구성 요소를 가정하십시오.x-inds, x-data는 Alpine.js의 기술입니다.)
components/hello.blade.php

{name: "与太郎"}

이 구성 요소를 사용하기 위해서는 다음과 같다.

<div {{ $attributes }}>
  こんにちは、<span x-html="user.name"></span>さん
</div>

그런데 아쉽게도 전혀 안 돼요.출력은 다음과 같습니다.

<x-hello x-data="{user: @json($user)}" />

이미 문법 오류입니다.그래서 나는 이번 주인공 Js:from()을 사용했다.

<div x-data="{user: @json($user)}">
  こんにちは、<span x-html="user.name"></span>さん
</div>

출력은 다음과 같다.

<x-hello x-data="{user: {{ Js::from($user) }}}" />

이러면 괜찮아, 알피니.js 동작, 화면에'안녕하세요, 타로 씨'를 출력합니다.

@js(추기)

이후 얼마 지나지 않아 Js:from()의 카탈로그 버전 @js()도 탄생했다.
[8.x] Introduce @js() directive #39522

후기

어쩌면 언젠가는 당신의 보살핌을 받게 될지도 모릅니다.
참고로 이 @json문서에서 사라짐과 함께 Js:from()을 대신합니다.앞으로는 Js:from()을 사용하는 것이 좋을까요?
잘못이 있으면 메시지를 남겨 주세요.