五天零基础手撕一款简单微信小程序(来自Android开发的经验帖)

系列文章目录

最近突然想上手微信小程序,从零基础在5天内上架了一个普通的微信小程序(由于计蒙本人想做一款教程的软件,但ios不会,而混合开发技术又不太行,于是想借助微信来适配),下面来记录一下计蒙写小程序的过程中的那些小问题。


其他平台请俺规则搬运,文章末尾可体验小程序,如有其它问题可私信计蒙。

文章目录

  • 系列文章目录
  • 前言
  • 一、页面间跳转传输数据。
  • 二、关于加载网页。
    • 1.需在微信小程序域名配置中加入自己的域名。(https)
    • 2.最开始计蒙想使用第三方框架来解析网页并显示
    • 3.解析网络的json数据
    • 4.还有一些使用到云数据库的问题。
  • 5.项目体验(微信扫码)
  • 总结


前言

老规矩,先大概看一下这个简单小程序

五天零基础手撕一款简单微信小程序(来自Android开发的经验帖)_第1张图片
五天零基础手撕一款简单微信小程序(来自Android开发的经验帖)_第2张图片
五天零基础手撕一款简单微信小程序(来自Android开发的经验帖)_第3张图片


以下是本篇文章正文内容

一、页面间跳转传输数据。

在Android开发中一般是用intent携带少量数据进行调转,而微信小程序如下。
携带数据方:urls为携带数据

 var urls = "www.jimengjia.com";
                wx.navigateTo({  
                    url: '../index/index?urls='+urls
                   })

接收数据方:接收并打印

 onLoad: function (options) {
        var urls=options.urls;
        console.log(urls);
},

二、关于加载网页。

1.需在微信小程序域名配置中加入自己的域名。(https)

2.最开始计蒙想使用第三方框架来解析网页并显示

代码如下(示例):

   //html转到微信小程序里
     wx.request({
       url:'https://mp.weixin.qq.com/s/-iPWXCNmFPMmw_W92KIOpQ',
	 	success: res => {
	 		wx.stopPullDownRefresh();
			this.setData({ html: res.data });
       }
    })
<htmltowxml text="{{html}}" type="html" bindWxmlTagATap="wxmlTagATap" ></htmltowxml> 

发现这种方式只能解析一些不是特别复杂的网页。于是改用web-view

3.解析网络的json数据

 wx.request({
         url: '网址',
         headers: {
            'Content-Type': 'application/json'
            },
			success: res => {
                console.log(res.data);
                this.setData({content: res.data.content });
                
      }
    })

在微信小程序开发工具里面,怎么都调试不出来,不知道是不是没配置什么。建议用真机调试。

4.还有一些使用到云数据库的问题。

计蒙建议发现问题时,先看微信小程序的官方文档api,可以更快的解决问题。

5.项目体验(微信扫码)

五天零基础手撕一款简单微信小程序(来自Android开发的经验帖)_第4张图片

总结

希望能对各位有所帮助,如有问题请私信计蒙。

你可能感兴趣的:(微信小程序,微信小程序,小程序,android,大前端)