12.26 小程序问题和解决

在Andriod真机测试出错

Plain 复制代码
VM59:247 error occurs:ENOENT: no such file or directory, access '/storage/emulated/0/Android/data/com.tencent.mm/MicroMsg/wxanewfiles/461ac1a77238ddbbf2b7c9824f32db9a/miniprogramLog/log2'
  • 解决方案

在真机测试的二维码界面,把真机测试2.0, 改为真机测试1.0

在wxml中用typeof报错

  • wxml中不支持js的typeof

  • wxml中需要使用js逻辑,可使用wxs

  • wxs模块

Plain 复制代码
WXS 代码可以编写在 wxml 文件中的 <wxs> 标签内,或以 .wxs 为后缀名的文件内。
每一个 .wxs 文件和 <wxs> 标签都是一个单独的模块。
每个模块都有自己独立的作用域。即在一个模块里面定义的变量与函数,默认为私有的,对其他模块不可见。
一个模块要想对外暴露其内部的私有变量与函数,只能通过 module.exports 实现。
  • 实现步骤

根目录 wxs/util.wxs

JavaScript 复制代码
var result = function (val) {
  return typeof (JSON.parse(val)) !== 'number'
}
module.exports = {
  result: result
}

页面test.js

JSON 复制代码
Page({
  data: {
    person: '{"username": "aa","age": 18}'
  }
})

页面test.wxml

HTML 复制代码
<wxs src="/wxs/util.wxs" module="tools" />
<view wx:if="{{tools.result(person)}}">显示</view>

如何取消小程序中的云开发模式

  1. 打开小程序项目, 单击"云开发", 打开云开发控制台

  2. 单击右上角"设置", "环境设置" , 在"环境名称" 右侧的名字上单击, 在下拉菜单中单击"管理我的环境"

  3. 在弹出的"环境管理"中, 鼠标移至下方的环境名称上,即显示"删除"

  4. 删除即可

引入图标字体时报错

  • 报错信息 [渲染层网络层错误] Failed to load local font resource /pages/fonts/iconfont.woff2?t=1661753720519-do-not-use-local-path-./assets/css/iconfont.wxss&11&7 the server responded with a status of 500 (HTTP/1.1 500 Internal Server Error)

  • 错误原因

字体文件的路径应该使用相对根目录的路径,而不是相对当前文档的路径

  • 错误代码

iconfont.wxss

CSS 复制代码
@font-face {
  font-family: "iconfont";
  src: url('../fonts/iconfont.woff2?t=1661753720519') format('woff2'),
       url('../fonts/iconfont.woff?t=1661753720519') format('woff'),
       url('../fonts/iconfont.ttf?t=1661753720519') format('truetype');
}
  • 正确代码
CSS 复制代码
@font-face {
  font-family: "iconfont";
  src: url('/assets/fonts/iconfont.woff2?t=1661753720519') format('woff2'),
       url('/assets/fonts/iconfont.woff?t=1661753720519') format('woff'),
       url('/assets/iconfont.ttf?t=1661753720519') format('truetype');
}

按官网引入vant的日历组件后不显示

  • 错误原因

官网模版如下,但是在json中, 只引入了van-calendar, 没有引入van-cell组件

HTML 复制代码
<van-cell title="选择单个日期" value="{{ date }}" bind:click="onDisplay" />
<van-calendar show="{{ show }}" bind:close="onClose" bind:confirm="onConfirm" />
  • 解决方案:
JavaScript 复制代码
{
    "usingComponents": {
        "van-calendar": "@vant/weapp/calendar/index",
        "van-cell": "@vant/weapp/cell/index"
    }
}

使用vant日历组件报错

Plain 复制代码
[渲染层网络层错误] Failed to load font https://at.alicdn.com/t/font_2553510_iv4v8nulyz.woff2?t=1649083952952
net::ERR_CACHE_MISS 
(env: Windows,mp,1.06.2208010; lib: 2.7.7)
  • 解决方案:

更改右上角"详情" , "本地设置", "调试基础库" 版本

Vant样式无效

  1. 重新再终端安装vant npm i @vant/weapp -S --production

  2. "工具"菜单----构建npm

  3. 重启开发者工具即可

wxml中无论写什么都不显示

原因: page.js中为空, 写入基础代码即可

Plain 复制代码
Page({})

在project.config.json中配置云开发失败

原因: 课件中复制过来有不规范字符 解决方案: 手敲出来即可

数据更新后视图不渲染

  • 错误代码:
Plain 复制代码
this.data.list.push()
  • 解决方案 必须使用this.setData更新数据,才能触发视图更新

事件处理函数中接收不到dataset

  • 错误原因: e.target 应该换为 e.currentTarget
相关推荐
saber_andlibert26 分钟前
TCMalloc底层实现
java·前端·网络
逍遥德27 分钟前
如何学编程之01.理论篇.如何通过阅读代码来提高自己的编程能力?
前端·后端·程序人生·重构·软件构建·代码规范
冻感糕人~41 分钟前
【珍藏必备】ReAct框架实战指南:从零开始构建AI智能体,让大模型学会思考与行动
java·前端·人工智能·react.js·大模型·就业·大模型学习
程序员agions1 小时前
2026年,“配置工程师“终于死绝了
前端·程序人生
alice--小文子1 小时前
cursor-mcp工具使用
java·服务器·前端
晚霞的不甘1 小时前
揭秘 CANN 内存管理:如何让大模型在小设备上“轻装上阵”?
前端·数据库·经验分享·flutter·3d
小迷糊的学习记录1 小时前
0.1 + 0.2 不等于 0.3
前端·javascript·面试
空&白2 小时前
vue暗黑模式
javascript·vue.js
梦帮科技2 小时前
Node.js配置生成器CLI工具开发实战
前端·人工智能·windows·前端框架·node.js·json
VT.馒头2 小时前
【力扣】2695. 包装数组
前端·javascript·算法·leetcode·职场和发展·typescript