微信小程序学习总结(五)常见问题实例小结

本文实例总结了微信小程序常见问题。分享给大家供大家参考,具体如下:

问题一

先来看我遇到的第一个问题
以下是我创建的目录

当创建完这个json文件之后,报了下面一个错

这个是我的报错信息。

解决方法:打开这个json文件,输入两个一对花括号完事。

问题二

以下是我引入js的代码,绝对路径报错。

var postsData = require('/data/post-data.js')

报错信息:

Uncaught Error: module “pages/post/data/post-data.js” is not defined

改正后的

var postsData = require('../../data/post-data.js')

数据

如果在onLoad方法中,如果是异步执行一个数据绑定,则需要使用this.setData方法。如果不是异步是同步的话,那么只需要对this.data赋值可实现数据绑定

格式化代码

shift + alt + F

数据缓存

需要说明的这个是数据的本地缓存,可以对本地缓存进行设置、获取和清理。同一个微信用户,同一个小程序 storage 上限为 10MB。

设置缓存

wx.setStorageSync('key','value');

获取缓存

wx.getStorageSync('key')

清除缓存

//清除所有缓存
wx.clearStorageSync();
//清除指定缓存
wx.clearStorageSync('key');

界面交互

显示消息提示框

wx.showToast({
 title: '成功',
 icon: 'success',
 duration: 2000 //设置弹框时间
})
//也可以这么写  三元运算的方式 根据需要来
wx.showToast({
 title:result?'确定收藏':'取消收藏',
 duration: 2000
})

显示loading

    wx.showLoading({
     title: '加载中',  //显示加载
    })

    setTimeout(function () {
     wx.hideLoading()  //取消加载
    }, 2000)

询问框

    wx.showModal({
     title: 'hello',
     content: postCollected?'确认收藏吗':'确认取消收藏吗',
     success: function (res) {
      if (res.confirm) {
       //更新缓存
       wx.setStorageSync('post_collected', postsCollected);
       that.setData({
        collected: postCollected
       })
      } else if (res.cancel) {
       console.log('用户点击取消')
      }
     }
    })

打印的res

​显示操作菜单

   onShareTap:function(event){
    wx.showActionSheet({
     itemList: [
      '分享给微信好友',
      '分享到朋友圈',
      '分享到QQ'
     ],
     itemColor:'#405f80',
     success:function(res){
      console.log(res)
     }
    })
   }

显示效果

获取全局变量

app.js

app({
  globalData: {
  g_name: "huangyuxin"
 }
})

使用

detail.js

var app = getApp();

希望本文所述对大家微信小程序设计有所帮助。

(0)

相关推荐

  • 微信小程序搭建及解决登录失败问题

    等了好久的小程序,终于在近日曝光了.现在就带大家来尝尝鲜.以下是一张随便看看的图. 一.构建微信小程序的步骤 下载开发工具 考虑到微信0.9.092100的Web开发者工具对于登录做了限制,所以下载登录还是需要一点门路的,我在下面有介绍,希望大家耐心的往下面看~下载工具的地址:链接 密码: r3hc. 破解的步骤就是:将破解压缩包的两个文件,放到如下图路径: 这个是MAC路径: 应用程序->微信web开发者工具->显示包内容 /Resources/app.nw/app/dist/compone

  • 微信小程序 HTTPS报错整理常见问题及解决方案

    微信小程序 HTTPS报错常见问题及解决方案 微信小程序开放公测已经一个多月了,因官方需求文档要求后台使用HTTPS请求进行网络通信,不满足条件的域名和协议无法请求.越来越多的开发者纷纷使用SSL证书实践微信小程序的应用情况,但仍然会碰到各类问题.本文列举了SSL证书常见的报错和解决办法,供开发者参考. 常见问题一 在微信小程序内测的过程中,几乎每个开发者们在实践的过程中都遇到了下图的报错: 原因及解决办法: 这是因为wx.request 发起的是 https 请求,微信小程序读取大部分是请求A

  • 微信小程序开发常见问题及解决方案

    前言 我们在做微信小程序开发的过程中,总会遇到各种奇葩的问题.今天就把我在小程序开发过程中遇到的各种问题,及对应的解决方案总结在这里,方便以后自己回顾,也方便大家查看. 云开发相关 一 云函数调用失败问题 [云函数] [login] 调用失败 Error: errCode: -404011 cloud function execution error | errMsg: cloud.callFunction:fail requestID , cloud function service erro

  • 微信小程序中遇到的iOS兼容性问题小结

    前言 随着小程序的热度不减,更多的电商大佬来时使用小程序,在微信小程序开发中,经常会遇到一些兼容性的问题,下面这篇文章就记录下在微信小程序中遇到的一些兼容性问题,iOS兼容性 1.iOS中input的placeholder属性字体不居中 对placeholder设置line-height及font-size 对input设置高度 2.iOS中滚动卡顿 设置-webkit-overflow-scrolling:touch; 3.微信小程序中解决iOS中new Date() 时间格式不兼容 在实现倒

  • 微信小程序 常见问题总结(4058,40013)及解决办法

    微信小程序 常见问题: 一:项目结构 微信小程序项目结构主要有四个文件类型,如下 WXML (WeiXin Markup Language)是框架设计的一套标签语言,结合基础组件.事件系统,可以构建出页面的结构.内部主要是微信自己定义的一套组件. WXSS (WeiXin Style Sheets)是一套样式语言,用于描述 WXML 的组件样式, js 逻辑处理,网络请求 json 小程序设置,如页面注册,页面标题及tabBar. 注意:为了方便开发者减少配置项,规定描述页面的这四个文件必须具有

  • 微信小程序遇到修改数据后页面不渲染的问题解决

    微信小程序遇到修改数据后页面不渲染的问题解决 前言: 去年从小程序一开始出来到现在,我一直是比较看好和保持一定的关注度的,小程序的掀起的波浪我觉得一开始是在前端及其他技术开发人群中的,这是我第一次有意识的亲眼目睹了一个新技术的发展,还是感觉比较荣幸的. 唱衰小程序?我的观点是肯定不可能,因为现在每天提交审核的小程序还在继续增加,而且有些小程序确实很好用,比如摩拜的扫码骑车,还有我上周去KTV,直接用小程序扫屏幕上的二维码,就可以绑定房间,然后通过小程序点歌,切歌,发表情包等方便好玩的事情,所以,

  • 微信小程序获取音频时长与实时获取播放进度问题

    首先在没有播放音频之前,居然拿不到总时长 但是在播放之后也需要设置setTimeout来获取 所以在监听音频播放进度更新事件中获取.顺便获取当前播放进度 按照官方的写法 audioPlayed: function () { myAudio.play() setTieout(() => { myAudio.onTimeUpdate(() => { console.log(myAudio.duration) //总时长 console.log(myAudio.currentTime) //当前播放

  • 微信小程序多音频播放进度条问题

    真的脑子疼,小程序的音频组件居然没有进度控制的功能,网上的方法又很少,逻辑通了就好写了. 1.所有音频播放.停止按钮使用状态切换控制 2.当点击某个音频播放时,首先将所有音频的状态置为停止状态,然后将当前音频置为播放状态 3.滚动条插件配合音频控件一起使用 4.播放状态时滚动条的长度随音频进度变化而变化,时间也要显示 5.拖动滚动条时,音频的当前时间随滚动条变化而变化 1.wxml <text class="left_text">{{item.currentProcess}

  • 微信小程序点餐系统开发常见问题汇总

    java后台相关问题 一,程序包lombok不存在 通常报这个错误,是因为,我们的开发者工具idea没有安装lombok库导致的 解决办法如下: 提示我们没有安装,我们就安装一个不就行了,下面来教大家如何安装. 1,点击扳手进入设置页 2,点击plugins,然后搜索lombok,点击install即可安装 3,安装完成后,重启idea开发工具即可 二,无法执行sql文件,IDEA 2019.1连接数据库报错(08001) 链接mysql数据库报如下错误 08001 could not conn

  • 微信小程序—setTimeOut定时器的问题及解决

    背景 实验室需要将项目的app搬到微信的小程序上,终于知道为什么程序员是手艺人了,只要有需求,就要想方设法去填充这种需求,去年是小程序的元年了可以说,去年冬天一个叫跳一跳的小程序游戏出现在我的微信中,当时就觉得腾讯是真的牛皮.一时间很多的软件小程序版相继出现,各大微信公众号也开始关联小程序.小程序相比于app,有着独特的优势,其中最大的就是没有ios和android平台之分,但是同时也有局限,你给我开发个小程序王者荣耀试试. 定时任务 微信小程序API中有两种定时任务 setInterval s

随机推荐