Toast消息在laravel-8中不起作用



我刚刚在表单提交中添加了一个toast,但它不起作用,我不理解这个问题。

public function create(Request $data)
{
$data->validate([
'name'          =>  'required|string|max:255',
'phone'         =>  'required|unique:users|numeric|digits:11',
'cnic'          =>  'nullable|unique:users|numeric|digits:13',
'email'         =>  'required|string|email|max:255|unique:users',
'designation'   =>  'nullable|string',
'department'    =>  'nullable|string',
'password'      =>  'required|string|min:4',
]);
User::create([
'name'          => $data['name'],
'phone'         => $data['phone'],
'cnic'          => $data['cnic'],
'email'         => $data['email'],
'role'          => $data['role'],
'designation'   => $data['designation'],
'department'    => $data['department'],
'password'      => Hash::make($data['password']),
]);
return redirect()->route('manage-users')->with('message', 'User created successfully!');
}

这是我的控制器,我在刀片中使用这种方式

@if(Session::has('message'))
toastr.info("{{ Session::get('message') }}");
@endif

这是css:

@section('vendor-style')
{{-- vendor css files --}}
<link rel="stylesheet" href="{{ asset('vendors/css/extensions/toastr.css') }}">
@endsection
@section('page-style')
{{-- Page Css files --}}
<link rel="stylesheet" href="{{ asset('css/plugins/extensions/toastr.css') }}">
@endsection

和js文件:

@section('vendor-script')
{{-- vendor files --}}
<script src="{{ asset('vendors/js/extensions/toastr.min.js') }}"></script>
@endsection
@section('page-script')
{{-- Page js files --}}
<script src="{{ asset('js/scripts/extensions/toastr.js') }}"></script>
@endsection

这些文件运行良好。谢谢你的帮助!

由于这是一个javascript库,您需要将此代码放入<script>标记中

@if(Session::has('message'))
toastr.info("{{ Session::get('message') }}");
@endif

@if(Session::has('message'))
<script>
toastr.info("{{ Session::get('message') }}");
</script>
@endif

如果仍然不工作意味着它不会触发你的代码,所以你可以这样做

@if(Session::has('message'))
<script>
$(function(){
toastr.info("{{ Session::get('message') }}");
})
</script>
@endif

一旦页面加载,该代码将触发该代码

我为高堆栈创建了一个包(Laravel 8并将不断更新(。请随意查看:

https://github.com/usernotnull/tall-toasts

最新更新