步骤一:小程序 生命周期

//app.js

App({

onLaunch: function () {

//当小程序初始化完成时,会触发onLaunch(全局只触发一次)

},

onShow: function () {

//当小程序启动,或从后台进入前台显示,会触发onShow

},

onHide: function () {

//当小程序从前台进入后台,会触发onHide

},

onError: function (msg) {

//当小程序发生脚本错误,或者api调用失败时,会触发onError并带上错误信息

},

other: function () {

//全局函数,可以被项目上的其他js文件调用

},

globalData: {

//全局对象

},

})

步骤二:配置服务器信息

步骤三:项目结构

1.数据(逻辑)

splash.js

// pages/splash/splash.js

Page({

/**

* 页面的初始数据

*/

data: {

movies: []

},

/**

* 生命周期函数--监听页面加载

*/

onLoad: function (options) {

const _this = this;

// 请求数据

wx.request({

url: 'https://api.douban.com/v2/movie/coming_soon',

data: {},

header: {

'content-type': 'json' // 默认值

},

success: function(res){

const data = res.data.subjects.slice(0,3);

// console.log(data);

_this.setData({

movies: data

})

}

})

},

// 事件绑定函数

start: function(){

// 重定向

wx.redirectTo({

url: '../board/board'

})

}

})

2.页面

splash.wxml

立即体验

3.样式

splash.wxss

/* pages/splash/splash.wxss */

page {

100%;

height: 100%;

}

swiper {

flex: 1;

height: 100%;

}

swiper-item {

flex: 1;

}

swiper-item image {

position: absolute;

height: 100%;

100%;

opacity: .8;

}

/*立即体验按钮*/

.btn {

position: absolute;

bottom: 150rpx;

left: 50%;

300rpx;

margin-left: -150rpx;

background-color: rgba(53, 73, 94, 0.7);

color: #fff;

border: 5rpx solid #fff;

font-size: 40rpx;

cursor: pointer;

}

步骤四:设置启动页

步骤五:效果图

小程序初始化服务器数据,微信小程序 项目实战(一)生命周期 配置服务器信息 splash启动页...相关推荐

  1. 小程序js中data获取服务器数据,微信小程序 获取javascript 里的数据

    微信小程序 获取javascript 里的数据 wxml如何获取js里的数据 例: wxml里: {{txt}} 通过上面的{{txt}}可以对应获取js里data下定义的txt的值 js里: dat ...

  2. 微信小程序购物车请求服务器数据,微信小程序购物车案例

    最近呢,我看到有人在问微信小程序的购物车怎么写,我呢就在这里写一写: 购物车主要的就是全选的判断.勾选单个物品判断是否全选.计算总价 效果Gif图: 直接简单粗暴的上代码: wxml代码: 全选 {{ ...

  3. 如何清除微信小程序服务器数据,微信小程序数据如何清空?

    数据处理类小程序 /*我的*/ #include #include #include #include #include int cs; //定义全局变量cs class student { priv ...

  4. 微信小程序获取云服务器数据,微信小程序云开发服务端数据库API 获取集合数据...

    Collection.get / Query.get 获取集合数据,或获取根据查询条件筛选后的集合数据. 如果没有指定 limit,则默认最多取 20 条记录. 如果没有指定 skip,则默认从第 0 ...

  5. 神策数据微信小程序 SDK 架构解析

    一.前言 神策数据微信小程序 SDK[1],是一款轻量级用于微信小程序端的数据采集埋点 SDK,包含代码埋点.全埋点功能.其中,全埋点功能通过代理微信小程序原生 App.Page.Component ...

  6. 神策数据微信小程序 SDK 功能介绍 | 数据采集

    一.前言 神策数据微信小程序 SDK,是一款用于微信小程序端的数据采集埋点 SDK.具体而言,是指开发者将 SDK 集成到开发的微信小程序项目中,通过配置或者在特定时机调用 SDK 提供的接口采集用户 ...

  7. Node.js搭建本地HTTP服务器(微信小程序)

    Node.js搭建本地HTTP服务器(微信小程序) Node.js简易搭建本地HTTP服务器 1. 首先关闭微信开发者工具中的验证 单击工具栏中的详情按钮,选中图中所示选项即可. 2. 将Node.j ...

  8. 微信图片服务器逻辑,微信小程序[第八篇] -- 实现完整的相册列表逻辑(小程序端服务器端)...

    这一讲过一围多元示一能近讲提下了多素效个外近章要进行的东西还蛮多的,从小程序navigator到wx.request,再到后台的restful进行数据集的通讯,前后台一起实战,和老沙一起做一个全栈工程 ...

  9. 微信小程序怎么取mysql,微信小程序怎么读取数据库?小程序如何读取数据?

    微信小程序怎么读取数据库?小程序如何读取数据?各位微信用户们,如果你再开发微信小程序的过程中,需要微信小程序读取数据库的话,就跟着小编往下看微信小程序怎么读取数据库. 微信小程序怎么读取数据库? 微信 ...

最新文章

  1. 理解 Azure 虚拟机的性能监视
  2. 【CV论文阅读】Rank Pooling for Action Recognition
  3. docker制作容器(待更新)
  4. Convert excel format exception.You can try specifying the ‘excelType‘ yourse-----EasyExcel导入
  5. 源码主干分支开发四大模式
  6. 自我介绍html模板王,小学生个人自我介绍模板10篇
  7. MATLAB中图像模式转换
  8. Windows和Mac系统盘瘦身的一些经验
  9. svg html5 编辑工具,HTML5之SVG
  10. MIT6.828课程JOS在macOS下的环境配置
  11. matlab标线,如何在matlab中以方位角画线?
  12. MFC 进程间通信(共享内存)
  13. 【C#】加加和减减、复合赋值运算符、一元二元运算符、关系运算符、bool类型
  14. springboot+vue+android商城源码
  15. 前端的短信验证码如何做(和后端配合)
  16. python tk库
  17. xamarin.android 资源图片问题
  18. Spark Streaming 项目实战 (4) | 得到最近1小时广告点击量实时统计并写入到redis
  19. matlab 调幅频谱ifft,通原抑制载波单边带调幅.doc
  20. 上瘾:让用户养成使用习惯的四大产品逻辑

热门文章

  1. 计算机学报格式_参考文献格式的那些事儿
  2. 大型网站架构系列:负载均衡详解(3)
  3. mybatis扩展ResultMap
  4. spring cloud 资源
  5. c++ windows下declspec
  6. 网络运维在经济危机中茁壮成长
  7. 深入理解line-height
  8. Python学生信息管理系统的开发
  9. Unity实现IOS原生分享
  10. CentOS系统缺少库文件解决办法