Dcat Admin 中如何让弹窗方法调用的视图文件渲染和执行 <script src=xxxx.js> 代码

1. 运行环境

1). 当前使用的 Laravel 版本?

8.75
//: <> (使用 php artisan --version 命令查看)

2). 当前使用的 php/php-fpm 版本?

PHP 版本:7.3

php-fpm 版本:

3). 当前系统

Windows 10 / WSL
//: <> (期待数值 Windows 10 / Ubuntu 20.4 / CentOS 8 )

4). 业务环境

开发环境
//: <> (期待信息 开发环境生产环境)
//: <> (是否使用负载均衡?请提供相关信息)

5). 相关软件版本

Nginx 1.22
MySQL 5.7
//: <> (提供相关软件的版本,如 Nginx 、MySQL、MongoDB 等)

2. 问题描述?

我正在使用 Dcat Admin 2,希望能在一个 弹窗 里显示如下视图文件的内容(这是一个 Vue 的单页面应用,加载了一个 js 文件)

resource/views/test.blade.php

<div id="app"></div>

<script src='/js/app.js'></script>

首先我直接在路由/控制器 里返回这个视图,确认了功能运行正常。

return view('test.blade.php');

然后我测试了几个使用弹窗显示视图文件的方法:

  1. 首先是简单的模态窗,发现渲染出来的代码直接把视图文件里的 <script src='/js/app.js'></script> 代码部分丢掉了 [失败]
Modal:make()->body(view('test'));
  1. 然后用 工具表单 的弹窗方式(实现LazyRenderable),发现 <script src='/js/app.js'></script> 代码能够显示出来,只不过没有执行。[失败]
// 首先生成表单类
class MyForm {
    public function form()
    {
        $this->html(view('test'));
    }
}

// 然后调用
Modal:make()->body(MyForm::make())
  1. 最后使用 表单弹窗 方式,Form::dialog() 来加载一个 url , 发现也会把<script> 部分丢掉。[失败]
Form::dialog('test')->url('/formbuilder')->click('.button-dialog');

我也尝试过根据官方文档的 静态资源 章节,分别在控制里加载 js 文件,以及在模板里加载 js 文件,都无法执行

Admin::js('/js/app.js');
<script src="{{ admin_asset('/js/app.js')}}"></script>

3. 您期望得到的结果?

如何在弹窗里加载视图,并正常运行视图文件里通过 <script> </script> 引入的 js 脚本呢?

4. 您实际得到的结果?

《L04 微信小程序从零到发布》
从小程序个人账户申请开始,带你一步步进行开发一个微信小程序,直到提交微信控制台上线发布。
《L03 构架 API 服务器》
你将学到如 RESTFul 设计风格、PostMan 的使用、OAuth 流程,JWT 概念及使用 和 API 开发相关的进阶知识。
讨论数量: 1
(function() {
  var hm = document.createElement("script");
  hm.src = "js文件地址";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();

试一下这种写法

2年前 评论

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!