下面的代码在vue js中的反应是什么？

Question

我有一个与拉拉和vue的项目，但我想使用react而不是vue。在laravel刀片中使用了如下所示的div

<follow-button user-id="{{$user->id}}"></follow-button>

在vue js文件中，如下所示

props:['userId'],

内部导出默认{}并使用this.userId访问它

我在下面的代码中搜索和尝试过

<script>
        let userId = '{{ $user->id }}'
    </script>

上面的代码在刀片和试图访问使用userId，但不工作。

React.js

import axios from 'axios';
import React from 'react';
import ReactDOM from 'react-dom';


function FollowButton() {
    return (
        <div className="container">
           <Button/>
        </div>
    );
}




const Button = () => {

     var follow = ()=>{
         axios.post('/follow/' + userId)
         .then(Response => {
             alert(Response.data)
         })
     }

    return(
        <div>
             <button onClick={follow}  className="btn btn-outline-primary mb-2 btn-sm ms-3">Follow</button>
        </div>
    )
}


export default FollowButton;

if (document.getElementById('followButton')) {
    ReactDOM.render(<FollowButton />, document.getElementById('followButton'));
}

index.blade.php文件

<div class="col-9 ps-5">
    <div class="d-flex justify-content-between align-items-baseline">
        <div class="d-flex align-items-center">
            <div class="h3 mt-1">{{$user->username}}</div>
            
            <div id="followButton" userId="{{$user->id}}"></div>
    </div>

     <script>
        let userId = '{{ $user->id }}';
     </script>

        @can('update', $user->profile)
        <a href="/p/create">Add New Post</a>
        @endcan

    </div>

    @can('update', $user->profile)
    <a href="/profile/{{$user->id}}/edit">Edit Profile</a>
    @endcan
        
    <div class="d-flex pt-1">
        <div class="ps-2"><b>{{$user->posts->count()}}</b> posts </div>
        <div class="ps-2"><b>123</b> followers </div>
        <div class="ps-2"><b>123</b> following </div>
    </div>
    <div class="pt-4 font-weight-bold" >{{$user->profile->title}}</div>
    <div>{{$user->profile->description}}</div>
    <div><a href="#">{{$user->profile->url}}</a></div>
</div>

服务器问题但是怎么办？都在本地服务器上。

Answer 1

这就是问题所在

在Controller中，原因非常简单，我使用了App\Models\User

<?php

名称空间App\Http\控制器；

使用照明\Http\请求；

使用App\Model\User；

类FollowsController扩展控制器{

public function store(App\Models\User $user)
{
    return $user->username;
}

}

而不是在声明use方法之后的用户。

<?php

名称空间App\Http\控制器；

使用照明\Http\请求；

使用App\Model\User；

类FollowsController扩展控制器{

public function store(User $user)
{
    return $user->username;
}

}