1. 本地flutter的web项目运行正常,打包到正式环境,报错,应该指向index.html的文件却指向main.dart.js
解决方案: 讲index.html的文件内
<base href="/">
改为
<base href="">
2. 打包后本地图片404
错误做法:在根目录下创建images文件夹,并存入图片,打包到开发环境找不到图片资源
解决:在根目录下创建images文件夹,并存入图片,在pubspec.yaml中的assets引入这些图片,如下:
每次插入图片都要引一次图片名称的话,真的会让人崩溃,所以可以简写成:
3. flutter中使用dialog不能实时更新UI视图,在setState中改变值不能实时响应页面
原因:flutter的dialog不是我们通常认为的弹窗,它是和页面(也就是statefulWidget和statelessWidget)平级的,他们使用的是不同的setState
解决:加一个StatefulBuilder组件, 在builder中获取这个showDialog的state,在需要改变的地方使用state去局部刷新,就可以全局使用了,如下:
更详细的如下图:
4. flutter中的定位Positioned内容不可操作
问题:flutter中的定位Positioned如果想要支持内容的操作,例如点击,是需要在Stack范围大小内才可以的
例如以上的功能,用vue写其实非常简单,但是用flutter的话,会遇到下拉的内容点击不到的问题,因为Positioned的位置是超出Stack容器的
解决:使用showDialog弹窗模拟下拉内容,将弹窗的遮罩层设置为透明,使用renderBox获取容器所在的位置以及大小,然后将showDialog的内容定位到该位置,代码如下:
5. 页面在本地调试可以正常显示,发到146则出现灰屏遮罩
可能出现问题的点:
(1)row和column内不能使用ListView
(2)给页面的根Widget添加scalffold
(3)注意expanded的合理使用