微信小程序踩坑

微信小程序踩坑

• 微信小程序踩坑
  • calc计算长度
  • 标签传值取值失败
  • scroll-view 中 flex 布局失效
  • 使用 wx.request() 报错 GET 400 (Bad Request)
  • navigator标签无法跳转
  • 使用云函数时 wx-server-sdk报错

calc计算长度

使用 calc() 函数计算长度时并未得到预期的结果

错误

height: calc(~"100vh-50rpx");
width: calc(~"100vw+50rpx");

注意 ： 计算符号+等和数字间得有空格隔开

正确

height: calc(~"100vh - 50rpx");
width: calc(~"100vw + 50rpx");

标签传值取值失败

标签传值输出结果为 undefined,传值会将字符全部转为小写

wxss代码

<text class="collect" data-tagName="zjc" bind:tap="handleClick">我的收藏</text>

js代码

handleClick(e){
    console.log("nickname", e.currentTarget.dataset.nickname); // 有值 zjc
    console.log("nickName", e.currentTarget.dataset.nickName); // 无值 undefined
}

输出结果：

scroll-view 中 flex 布局失效

在 scroll-view 中加入 enable-flex = {{true}} 即可

<scroll-view scroll-y="true" enable-flex="true">
    code...
  </scroll-view>

使用 wx.request() 报错 GET 400 (Bad Request)

在浏览器访问接口是有效的，一用 wx.reqeust() 就报 GET 400 (Bad Request) 错误

可以用这个方法：wx.request传入的对象参数中的head改一下

wx.request({
　　header: {
　　// "Content-Type":"application/json"  请求会返回400（bad request）
　　//这里修改json为text
　　"Content-Type": "application/text"
　　},
    url：your_url；
})

navigator标签无法跳转

• 无该页面
• 跳转页面 app.json 文件中未注册
• 跳转页面为 tabBar中页面，需加上 open-type=“switchTab”

使用云函数时 wx-server-sdk报错

直接在该云函数目录下进入终端运行以下命令

npm install --save wx-server-sdk@latest

tips：电脑中得安装node环境