小程序开发过程之数据请求封装与模板的使用

2018/4/14 16:03:43
摘要: 在开发小程序过程中,需要对数据请求进行封装,在引入模板的时候,也需要了解模板定义及其引入方法。本文这对这两个开发

在开发小程序过程中,需要对数据请求进行封装,在引入模板的时候,也需要了解模板定义及其引入方法。本文这对这两个开发过程中必要的流程进行分析,说说如何进行数据请求封装以及小程序模板的引入使用。

1、数据请求封装的方法

(1)将所有的接口放在统一的js文件中并导出,示例代码如下

const api = {

    interface1: 'https://........',

     interface2: 'https://.......',

     interface3: 'https://。。。。',

     .....

}

module。exports = api;

(2)在app。js中创建封装请求数据的方法,代码如下

fetch(url,data, callback) {

      wx.request({

          url,

          data: data,

          header: {

              'Content-Type': 'application/json'

          },

          success(res) {

              callback(null, res.data);

          },

          fail(e) {

              callback(e);

          }

      })

  },

(3)在子页面中调用封装的方法请求数据即可实现数据封装,代码如下

import API from "../../api/api.js";

const app = getApp();

const conf = {

    data:{

        title:'正在拼命加载中...',

        loadding:true

    },

    onLoad (){

        app.fetch(API.hot,{},(err,data) => {

        })

},

2、使用模板

(1)定义模板:name设置模板的名字

<template name="homecell">

     <view>

    </view>

 </template>

(2)引入模板

<import src="../../commonXml/homecell.wxml" />

(3)使用模板is后,写模板的name..通过data来传递所需要的数据数据

<template is="homecell" data="{{item}}"></template>

声明:文章"小程序开发过程之数据请求封装与模板的使用"为互诚科技—微信小程序开发公司的原创文章,转载请注明出处,谢谢合作!
标签:小程序干货
电话咨询:18011971195(黄先生)
在线留言:
微信扫码,关注我们
相关文章
  • 手势开发研究,微信小程序的单触摸电与多触摸点

    在微信小程序的开发过程中,手势常常被应用在canvas、交互的开发中,所以手势对一些开发效果来说是比较重要的

  • 目前的微信小程序所不能及的三个方面

    微信小程序从上线至今大约半年,腾讯官方不断地在调整优化其功能设置,尽量让小程序的开发体验与使用体验做到令人满意的程度。可是,至今有三个方面仍是小程序所不能及的,这三个方面也限制了小程序的在某些方面的推广与发展,目前来看是不利的。

  • 微信小程序开发——企业品牌宣传推动力

    企业拥有自己的品牌,随之而来的工作就是进行宣传推广,而企业品牌策划实施的要点,主要就分为三个部分:方式创新、体验满意跟促进分享。这每一个方面都是树立品牌形象、提升品牌知名度的必要过程,依靠微信小程序开发区推动企业品牌宣传也必须如此。

  • 微信小程序开发技术教程:视图容器组件详解(一)

    微信小程序开发的时候,需要设计一个视图容器组件的问题,它有多种视图样式,每一种都有需要注意的内容。所以

  • 微信小程序升级页面体验让用户爱上你的小程序

    昨日微信小程序开放了新的页面能力,在原有页面能力的基础上对其进行优化和升级,以提高开发者的开发效果跟用户体验的满意度。而升级优化体现在哪些方面,就是小编在今天这篇推文里的主要写作目的。

  • 微信小程序开发教程之index 页面解析

    微信小程序的每一个页面都包含三个文件,分别是.js(处理逻辑),.wxml(描述页面内容),.wxss(配置页面样式),index 页面同样

众赢彩票充值 桔子彩票官网 166彩票官网 诚信彩票官网 满堂彩官网 好彩客官网 满堂彩充值 多盈彩票 桔子彩票充值中心 188彩票充值中心