zoukankan      html  css  js  c++  java
  • 微信小程序开发

    序言:小程序刚出来的时候,关注度高的无与伦比,但是出来后关注瞬间掉了,因为无法跟原生app相比,也没有更好的推广。或者受环境影响,现在的小程序慢慢的完善,有了一定的需求量了,说这么多废话就是,公司现在要求开发小程序,所以重新关注了一下小程序。今天简单说说几点吧

    第一,嵌套h5页面,怎么嵌套呢?

    那就简单说说web-view 组件,这是一个可以用来承载网页的容器,会自动铺满整个小程序页面。

    类似于Frame、Iframe、Frameset标记,只是对于目前来说,web-view还缺乏灵活性

    例如这样

    <!-- wxml -->
    <!-- 指向微信公众平台首页的web-view -->
    <web-view src="https://mp.weixin.qq.com/"></web-view>

    其实两个属性,一个src这个就是你所要链接的h5页面地址,另一个bindmessage,简单意思就是在特定情况是触发并收到消息。

    简单介绍下,具体了解可打开https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html

    第二微信小程序请求接口

    通过wx.request来处理,看下面代码是否很熟悉,跟我们使用的ajax是不是很像,没错,你想的没错微信小程序获取数据就是这么简单。而且后台管理这些都没变。这就不多说了
    wx.request({  
          url: 'test.json',//上线的话必须是https,没有appId的本地请求貌似不受影响  
          data: {},  
          method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT  
          // header: {}, // 设置请求的 header  
          success: function(res){  
            console.log(res.data)     
       }, fail:
    function() { // fail }, complete: function() { // complete } })

    参考文档https://developers.weixin.qq.com/miniprogram/dev/api/network-request.html#wxrequestobject

    后续开发遇到问题也可以相互讨论,毕竟接下来将进入开发环节了。

    微信小程序只要去看下微信小程序文档,我觉得对于大家来说都是没啥问题的。

    噢,说一个微信跳转传参的小东西

    跳转的数据传递

    以wx.navigateTo为例:

    简单讲述,wx.navigateTo传入的url是跳转的页面(使用相对路径)

    wx.navigateTo({
        url:"pages/test/test"
    });

    那么参数传递至下一页面,则只需要在路径后面,添加?问号,?后面接的是参数,以key-value的方式。

    这里传了个value为1的参数

    wx.navigateTo({
        url:"pages/test/test?num=1"
    });

    然后在test.js中的onLoad()函数中得到值:option.num就可以得到了,如下:

    onLoad: function (option) {
        this.setData({
            type:option.num,
        });
        console.log(option.num);
    }

    这样就可以获取到你传递过来的参数了,然后要怎么开发就怎么开发啦。

    微信小程序如何引用其他js文件

     

    1.先建立一个common.js文件,在common.js编写我们的程序,

    function myfunc() {
    console.log("myfunc....");
    }

    module.exports.myfunc = myfunc; 这样暴露接口,这里不暴露是不能引用的,

    在文件域js内

    var common = require("../../common.js");去链接过来,光链接过来还不行!

    var app;
    var common = require("../../common.js");
    Page({
    data:{

    },
    onLoad:function() {
    app = getApp();
    this.setData({version:app.globalData.appName});
    common.myfunc();  //最后我们需要执行才能生效!
    }
    })

    嗯,今天聊到这,准备开发工作,下周开始开发、、、、遇到问题再跟大家分享。。

  • 相关阅读:
    第一章 前言
    《Linux内核设计与实现》CHAPTER18阅读梳理
    《Linux内核分析》第五周 扒开系统调用的三层皮(下)
    《Linux内核设计与实现》CHAPTER5阅读梳理
    《Linux内核分析》第四周 扒开系统调用的“三层皮”
    《Linux内核设计与实现》CHAPTER1,2阅读梳理
    《Linux内核分析》第三周 构建一个简单的Linux系统MenuOS
    《Linux内核分析》第二周 操作系统是如何工作的?
    《Linux内核分析》第一周 计算机是如何工作的?
    毕业设计 之 一 《构建之法》阅读笔记
  • 原文地址:https://www.cnblogs.com/zwp06/p/8676253.html
Copyright © 2011-2022 走看看