开发微信小程序——记录初学途中的断腿小坑

482 阅读3分钟

很早之前就注册开发者了,一直没有动手。那句话怎么说的?

思想上的巨人🧍‍♀️,行动上的矮子🤏

话不多说,赶紧动起来,不定时更新,看腿🦵长的快,还是断的快。

按照惯例每个问题分为三个部分:
1. 【问题描述】问题出现的情况,和报错信息。
2. 【解决方法】本白亲自体验过可以解决问题的方法。
3. 【其他】教程或其他朋友们提供的解决方法,但本白试过没有成功。或许其他环境下是可以成功的🤔,不妨一试

一、 【不在以下request合法域名列表中】调用wx.request接口时,控制台报错。

**解决方法:**需要登录小程序平台 -> 开发管理 -> 开发设置 -> 服务器域名 右上角修改(一个月50次机会)。如果小程序要打开页面,页面的域名也需要添加在这里。

开发环境中,只需要在微信开发者工具 -> 右上角详情勾选不校验域名就可以了~比配置代理方便!!

二、 【接上题】添加域名后依旧报错。

**解决方法:**这里真的是研究了半天🤭 是因为小程序使用的AppId是测试账号,后台添加域名使用的是主账号。检查AppId是否一致。

三、 【查看小程序AppId】想看其他小程序的AppId、页面路径。

**解决方法:**操作步骤如下

1. 登录公众号后台(注意不是小程序后台,小程序后台只能给自己的小程序添加权限),点击“草稿箱” -> “新的创作”,到编辑页面,再点击上方菜单栏的 “小程序”

2. 在弹出的弹窗填入想要获取页面的小程序AppId(获取AppId请看下一步)

3. 微信打开想要获取页面的小程序,点击右上角三个点,选择小程序名称,再选择更多资料。

4. 点击“获取更多页面路径“,输入自己的微信号

3. 打开手机微信,进入想要复制的小程序页面。点击右上角三个点,出现“复制该页面路径”的选项。

四、 【该页面不存在】自己的小程序跳转其他小程序,无反应或者是白屏,显示访问的页面不存在。

我使用的方法是wx.navigateToMiniProgram,除了appId以外,还有一个path参数。直接用上面的方法复制出来的路径,会提示“访问的页面不存在”。

**解决方法:**如果复制出来的路径带有.html,则删去。如果没有,则加上。

示例:page/detail/detail**.html**?id=xxxxx

五、【tdesign】按照官方方法引入了tdesign,但是控制台报错 "tdesign-miniprogram/image/image" 未找到

**解决方法:**其实官网写了,我没有认真看。安装完之后还有一步操作:

引入Vant Weapp也是同样。需要构建npm后才可以使用 。

六、【接上题】构建之后又报错 file not found: ./miniprogram_npm/tdesign-miniprogram/action-sheet/action-sheet.wxml

**解决方法:**开发工具右上角“详情” -> “本地配置”,将“自动热重载”勾掉就可以了

七、打开PDF文件

**解决方法:**第一步,先添加一个新的页面wxml,里面只写

<!-- web页面 --><web-view wx:if="{{isIos && link}}" src="{{link}}"></web-view>

第二步,Ios和安卓处理方式不一样。

Ios直接点击pdf的地址即可查看文件,安卓需要先下载文件到本地,再从本地打开

我还没试过插件,pdf阅读插件也是可以的。

let _this = this;    wx.getSystemInfo({      success: function(res) {        console.log(res,"机型");        //判断当前机型        if (res.system.indexOf('iOS')!=-1){          _this.setData({            link: url          })        }else{          _this.setData({            isIos:false          })          wx.downloadFile({            url: url,            success(res){              console.log(res,"下载后地址");              let path = res.tempFilePath;              wx.openDocument({                filePath:path,                fileType:"pdf",                success(){                  wx.navigateBack({                    delta:1                  })                }              })            }          })        }      },    })

未完待续

感觉微信小程序看上去挺简单的,真正上手时一步一个困难。铁子们继续学习吧