RageFrame学习笔记:创建路由+导入layui
这是我写的学习RageFrame的第二篇,这一篇给大家分享下我是如何创建路由,导入外部js,css文件的,这里写下我的全部流程,希望对大家有所帮助。
话不多说,直接开始,在上一章中,我们已经把项目实例化到本地了(查看点击这里),但是我发现,用户名和密码是随机出来了,难记,这里给大家先分享如何修改默认用户名和密码
1.我们先登录到后台,点击用户名的下标栏,到这里修改密码。
2.密码修改完成后,打开项目数据库,打开rf_backend_member表格,修改这里的用户名后点击保存即可(真*物理修改)
项目实例化后,我们看下大致的目录结构
按照YII2官方文档的指示,会自带一个路由,modes生成器,我们直接网站后加/gii
但如果不是localhost访问时页面会报错,这个时候需要修改配置文件,这里放下解决方法
urlManager配置了后缀为 .html,在使用 /gii 访问时,由于没有后缀,YII2框架在解析URL时,就直接返回404了,所以在配置了 suffix 属性的时候,就需要加上.html来访问,或者不配置’suffix’属性即可 如果你通过本机以外的机器访问 gii,请求会被出于安全原因拒绝,所以需要配置 gii 为其添加允许访问的 IP 地址 'gii' => [ 'class' => 'yii\gii\Module', 'allowedIPs' => ['127.0.0.1', '::1', '*.*.*.*'] // 按需调整这里 ]
接下来是创建路由,这里接入我找到的最全流程
也可点击前往
选择"Module Generator"(模块生成器),将会看到如图所示的画面。
当光标定位到"Module Class"时,会有一个提示框显示出来,提示"Module Class"必须是完整的路径名和类名,这里需要输入"app\modules\admin\Module"。在"Module ID"输入框中输入"admin",然后点击"Preview"按钮,该按钮的功能是展示所有将会被生成的文件,并且这些文件允许在创建之前进行预览,如图所示。
点击"Generate"按钮,生成所有文件。因为Web服务器进程需要写入权限,所以要确保"modules"文件夹对于该应用程序是可写入的。模块的基本目录结构创建成功后,会看到如图所示的页面。
该页面中有关于模块的配置使用说明和,只需要修改应用主配置文件,生成的模块就可以被正确调用。
到这里,我们的路由就创建好了,但是你会发现,明明照着流程来了,就是访问不了
这里给出我的解决方法
改两处 一处是改 common/models/Country里面的 namespace app\models; 为 namespace common\models; 另一处是 改\frontend\controllers\CountryController.php 里面的 namespace app\controllers; use yii\web\Controller; use yii\data\Pagination; use app\models\Country; 为 namespace frontend\controllers; use yii\web\Controller; use yii\data\Pagination; use common\models\Country;
最后解决,成功访问
接下来分享如何导入外部js,css文件,找到文件目录中的\web\backend\resources\plugins,放入你的文件
然后修改\backend\assets\AppAsset.php文件
public $basePath = '@webroot'; public $baseUrl = '@web/resources'; public $css = [ 'plugins/toastr/toastr.min.css', // 状态通知 'plugins/fancybox/jquery.fancybox.min.css', // 图片查看 'plugins/layui-v2.5.6/css/layui.css', 'plugins/cropper/cropper.min.css', 'css/rageframe.css', 'css/rageframe.widgets.css', ]; public $js = [ 'plugins/layer/layer.js', 'plugins/layui-v2.5.6/layui.js', 'plugins/sweetalert/sweetalert.min.js', 'plugins/fancybox/jquery.fancybox.min.js', 'js/template.js', 'js/rageframe.js', 'js/rageframe.widgets.js', ];
在这里添加上对应文件的路径即可。
如果对您有所帮助,欢迎您点个关注,我会定时更新技术文档,大家一起讨论学习,一起进步。