微信小程序todolist

XUI 发布于2019-08-20 12:24 / 2584人阅读

摘要：微信小程序列表页面简单的列表页面和数据添加，此时有一些问题在清除一些用户交互的页面的时候有些问题。一个微信小程序，同时只能有个网络请求连接。可能要在服务器上配置一些参数，可以让微信小程序调用基本上是没有问题的。

weixinApp 微信小程序toDoList 列表页面

简单的列表页面和数据添加，此时有一些问题

setData在清除一些用户交互的页面的时候有些问题。

inputA 是一个输入框，当我提交数据的时候，需要清除表单的数据，setData不能清除很好的清除。

添加数据

使用wx.setStorageSync(KEY,DATA).

try {
    wx.setStorageSync("key", "value")
} catch (e) {
}

删除数据

使用 wx.removeStorageSync(KEY)

try {
  wx.removeStorageSync("key")
} catch (e) {
  // Do something when catch error
}

详情页面

此时用到路由机制


    查看

模块化的测试 使用了一些ES语法 微信wx.request

wx.request发起的是https请求。一个微信小程序，同时只能有5个网络请求连接。

在测试wx.request的时候.

wx.request post传参数，开发者服务器取不到参数

// 在php内嵌入此句也不适合。
header("Access-Control-Allow-Origin:*");
// 可能要在nginx 服务器上配置一些参数，可以让微信小程序调用

基本上get是没有问题的。（url各种带参数是没有问题的）

其他的API没有测试,用的不多,如果有需要再进行测试。

var count = 0
var maxRequest = 100
var getRequest = function(){

    wx.request({
        // 此域名必需要配置
        url: "https://test.com/t/wxRes", //仅为示例，并非真实的接口地址
        success: function(res) {
            count++
            if(count < maxRequest){
                getRequest()
            } 
        },
        fail: function(res){
            console.log(res)
        }
    })
}
// https请求 
for(var i = 0; i< 5;i++){
    getRequest()
}
// 如果直接for10次的话，肯定有错误。这里只能for5次

我在测试的时候发现一个问题。post数据的时候一直不成功。经过查看文档得出结论。
需要加一段代码

// log.js

// 头部
    header: {  
     "Content-Type": "application/x-www-form-urlencoded"  
    },  
// 这样的数据是取不到值的。要把参数转化为这个形式才ok, **id=1234444&name=adasdadad**

var postData = {
    id: 1234444,
    name: "qidongyou"
};
postData = util.json2Form(postData);

// util.js
function json2Form(json) {  
    var str = [];  
    for(var p in json){  
        str.push(encodeURIComponent(p) + "=" + encodeURIComponent(json[p]));  
    }  
    return str.join("&");  
}

module.exports = {
  json2Form: json2Form
}

测试结果

wx.getImageInfo取远程图片元信息是有问题的。https://36dong.com/assets/ima...，在本地测试是没有问题。

项目代码

https://github.com/qidongyou/weixinApp

其他相关文章

官方文档

测试工具

segmentfault相关文档

post参考文档

查找问题相关网站

云服务器服务器托管微信小程序微信小程序支付微信小程序部署微信小程序搭建

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/80964.html

初学微信小程序 TodoList

摘要：微信小程序的学习微信小程序的开始尝试微信开发者工具生成目录如下主页日志页面工具大体为每一个即是一个页面文件，每个页面有一个文件规定描述页面的这四个文件必须具有相同的路径与文件名。微信小程序的学习微信小程序的开始尝试 TodoList 微信开发者工具生成目录如下： . |-- app.js |-- app.json |-- app.wxss |-- pages | ...

BearyChat 2019-08-22 17:12 评论0 收藏0
微信小程序实现运动步数排名与发布个人动态&服务器部署

摘要：项目规划本项目为基于微信手机应用平台的一款运动互动型小程序，实现了用户即时运动步数群内与个人动态的发布，小程序前端采用原生框架，后端采用基于的框架，数据库采用，对象存储采用七牛云，服务器采用阿里，域名采用认证。 1. 项目规划本项目为基于微信手机应用平台的一款运动互动型小程序，实现了用户即时运动步数群内PK与个人动态的发布，小程序前端采用原生框架，后端采用基于Node的koa2框架，...

laoLiueizo 2019-08-26 13:22 评论0 收藏0
用mpvue写个玩意儿玩玩

摘要：微信开发工具仅用于调试。下面可以配置一个微信小程序的参数，文件就是我们要编辑的页面了。补充一下，调用之后获取了经纬度之后，还可以玩玩微信的组件。试着用微信写一个组件。下周公司要搞黑客马拉松了，组里可能会做个小程序。然后看到了mpvue感觉还不错，于是就打算试试水。用vue写小程序听上去美滋滋。那么先开始吧！全局安装 vue-cli $ npm install --global vu...

lauren_liuling 2019-08-22 16:32 评论0 收藏0