如何将 Sql 行数据传递给 Vue 文件（Laravel 项目）

Posted 2023-02-22

【中文标题】如何将 Sql 行数据传递给 Vue 文件（Laravel 项目）

【英文标题】：How to pass Sql row data to Vue file (Laravel Project)

【发布时间】：2019-06-25 04:34:45

【问题描述】：

我正在尝试传递数据并在 Vue 文件中使用它，但我无法让它工作这是我的代码

<template>
    <div class="row profile-container">
        <div class="col-sm-4">
            <img src="/img/default.jpg"  class="profile-img">
        </div>
        <div class="col-lg">
            <h5>$user->name</h5>
            <div class="card w-100">

                <ul class="list-group list-group-flush">
                    <li class="list-group-item">Cras justo odio</li>
                    <li class="list-group-item">Dapibus ac facilisis in</li>
                    <li class="list-group-item">Vestibulum at eros</li>
                </ul>
            </div>
        </div>
    </div>
</template>

这是返回到带有数据的配置文件的配置文件控制器

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\User;

class ProfileController extends Controller

    public function index($id)
    
        $user = User::where('unique_id', $id)->firstOrFail();

        return view('pages.profile')->with('user', $user);
    

这是 app.js

require('./bootstrap');

window.Vue = require('vue');

Vue.component('welcome', require('./components/Welcome.vue').default);
Vue.component('profile', require('./components/Profile.vue').default);


const app = new Vue(
    el: '#app'
);

路线

Route::get('/', 'PagesController@index' );

Auth::routes();

Route::get('/logout', '\App\Http\Controllers\Auth\LoginController@logout');
Route::get('/profile/id', 'ProfileController@index');

这是刀片文件 pip didly doo 我不知道该写什么了，看起来我的帖子主要是代码，所以我只是在这里添加一些细节，thatsprettycoolshaggyisgod 我不知道还要在这里添加什么请发送帮助

@extends('layouts.master')
@section('title')
  <title>Profile</title>
@endsection
@section('content')
  @if(Auth::user()->type==='user')
  <profile></profile>
@elseif (Auth::user()->type==='admin')
  <h1>Hi Admin</h1>
@endif
@endsection

【问题讨论】：

你也有你的脚本代码吗？

刚刚添加了所有内容

你也可以发布你的路线

好的也添加了

请问您可以在包含 vue 组件的位置添加刀片文件吗？

【参考方案1】：

您的脚本应如下所示：

<script>
    export default 
        name: 'profile',
        data() 
            return 
                user: []
            
        ,
        methods: 
            getUser() 
                let _this = this;
                axios.get('/user')
                    .then(function (response) 
                        _this.user = response.data;
                    ).catch(function (error) 
                        console.log(error);
                );
            ,
        created() 
            this.getUser();
        
    
</script>

将此添加到您的路线文件中：

Route::get('/brands', function($id) 
  $user = User::where('unique_id', $id)->findOrFail();
  return view('pages.profile')->with('user',$user);
);

如果这有帮助，请告诉我，我认为你错过了很多代码，这不像将数据传递到 Laravel 视图那么容易，但希望这能让你开始