#laravel #vuejs2 #inertiajs #jetstream
Вопрос:
Поэтому я использую это промежуточное программное обеспечение в Laravel, чтобы проверить, заблокирован ли пользователь, а затем выйти из системы, если это так:
class IsUserBanned
{
/**
* Handle an incoming request.
*
* @param IlluminateHttpRequest $request
* @param Closure $next
* @return mixed
*/
public function handle($request, Closure $next)
{
if (auth()->check() amp;amp; auth()->user()->banned_until != null) {
if (auth()->user()->banned_until == 0) {
$message = 'Your account has been banned permanently.';
}
if (now()->lessThan(auth()->user()->banned_until)) {
$banned_days = now()->diffInDays(auth()->user()->banned_until) 1;
$message = 'Your account has been suspended for ' . $banned_days . ' ' . Str::plural('day', $banned_days);
}
return redirect()->route('login')->with(auth('web')->logout())->with('message', $message);
}
return $next($request);
}
}
Я знаю, что для отображения сообщения в blade.php Я бы использовал что-то вроде этого:
<div class="card-body">
@if (session('message'))
<div class="alert alert-danger">{{ session('message') }}</div>
@endif
<form method="POST" action="{{ route('login') }}">
Мой вопрос в том, как бы я сделал то же самое в компоненте Vue? Сработает ли v-if? Я новичок в Vue, так что извините, если это глупый вопрос…
Редактировать:: Я предполагаю что-то вроде этого, но это не работает
<div v-if="message" class="mb-4 font-medium text-sm text-red-600">
{{ message }}
</div>
Спасибо.
Комментарии:
1. вы пробовали что — нибудь с vue? ваши данные поступают из api или Интернета?
2. Я использую инерцию и vue2
3. Можете ли вы показать нам, как вы обрабатываете состояние для сообщения?
4. Не уверен, что вы имеете в виду, я что-то пропустил? Как я уже сказал, я новичок в Vue, пытаюсь преобразовать все мои блейды в Vue SPA, обычно эти первые два фрагмента кода работали нормально, нужно ли мне сохранять состояние сообщения? извините за глупые вопросы
Ответ №1:
По умолчанию Vue не имеет доступа к состоянию сеанса Laravel, так как это может привести к утечке информации. Что-то вроде того, что вы предложили (используя v-if
директиву для отображения сообщения), сработало бы, но вам все равно придется каким-то образом передать сообщение интерфейсу.
Если вы используете Laravel Jetstream с инерцией и Vue, вы можете просто передать message
элемент сеанса своему интерфейсу в качестве реквизита Vue.
В вашем компоненте Vue (если вы используете компоненты с одним файлом, он будет в *.vue
файле) вам нужно будет добавить его в свой массив реквизитов, что-то вроде этого:
// template up here ...
export default {
data() { ... },
props: ['message'] // add to this array
// ...
}
А затем вам нужно будет передать опору, когда вы будете реагировать на инерцию со стороны Laravel. Если вы будете следовать своему login
маршруту, вы в конечном итоге найдете звонок Inertia::render
или inertia(...)
помощника. Вы бы добавили сеанс в массив свойств там, что-то вроде этого:
// probably in routes/web.php
Route::get('/login', function() {
// more code ...
Inertia::render('Login', [ 'message' => session('message') ]);
});
Именно так вы бы сделали это для передачи свойств на страницу в целом, однако, если вы используете не настроенное представление входа по умолчанию, предоставляемое Laravel Fortify через стартер Jetstream, вам потребуется предпринять дополнительные шаги:
- SFC Vue, который вы редактируете, скорее всего, находится в
resources/js/Pages/Auth/Login.vue
- Инерционный отклик, отображающий эту страницу, обычно автоматически обрабатывается платформой. Чтобы настроить его, вам нужно будет следовать этим инструкциям и использовать код, который выглядит ближе к этому:
Fortify::loginView(function () {
return Inertia::render('Auth/Login', [
'message' => session('message')
]);
});
Комментарии:
1. Ты абсолютная легенда! Мне пришлось настроить промежуточное программное обеспечение handleinertiarequests, просто добавив «сообщение» = > сеанс («сообщение») в конце, а затем добавить реквизиты в мой компонент vue, но это сработало, спасибо большое за подробное объяснение и сопроводительные документы, избавили меня от огромной головной боли! Попытался поддержать ваш ответ, но я здесь новичок и пока не могу голосовать, обязательно вернусь и поддержу, когда смогу, еще раз спасибо!
2. @Джо Блэк В любое время! Рад, что смог помочь! Даже если вы не можете проголосовать, вы должны иметь возможность нажать на галочку, чтобы отметить этот ответ как принятый!