1. 小程序有几个文件?
WXML
: 微信自己定义的一套组件WXSS
: 用于描述WXML
的组件样式js
: 逻辑处理json
: 小程序页面配置
2.小程序怎么跟随事件传值
在 页面标签上通过 绑定
dataset-key = value
, 然后绑定点击通过e.currentTarget.dataset.key
来获取标签上绑定的值。
<button bindtap="get" data-name="测试"> 拿到传值</button>
get(e){
console.log(e.currentTarget.dataset.name)
},
3. 小程序 WXSS
与 CSS
的区别
WXSS
wxss
背景图片只能引入外链,不能使用本地图片 小程序样式使用@import
引入 外联样式文件,地址为相对路径。 尺寸单位为rpx
,rpx
是响应式像素,可以根据屏幕宽度进行自适应。
4. 小程序的双向绑定和Vue哪里不一样。
小程序 直接使用
this.data.key = value
是 不能更新到视图当中的。必须使用
this.setData({ key : value })
来更新值。
5. 小程序的生命周期函数
onLoad
: 页面加载时触发。一个页面只会调用一次,可以在onLoad
的参数中获取打开当前页面路径中的参数onShow
: 页面显示 / 切入前台时触发调用。onReady
: 页面初次渲染完成时触发,一个页面只会调用一次。onHide
: 页面隐藏 / 切入后台时触发,如navigateTo
或底部tab
切换到其他页面,小程序切入后台等onUnload
: 页面卸载时触发。如redirectTo
或navigateBack
到其他页面时.
6. 小程序怎么实现下拉刷新
两种方案
方案 一 :
通过在
app.json
中, 将"enablePullDownRefresh": true,
开启全局下拉刷新。 或者通过在组件 .json
, 将"enablePullDownRefresh": true,
单组件下拉刷新。方案二:
scroll-view
: 使用该滚动组件 自定义刷新,通过bindscrolltoupper
属性, 当滚动到顶部/左边,会触发scrolltoupper
事件,所以我们可以利用这个属性,来实现下拉刷新功能。
7. bindtap
和 catchtap
区别
相同点:
都是点击事件
不同点:
bindtap
不会阻止冒泡,catchtap
可以阻止冒泡。
8. 小程序有哪些传递数据的方法
\1. 使用全局变量
在
app.js
中的this.globalData = { }
中放入要存储的数据。 在组件.js
中, 头部 引入const app = getApp();
获取到全局变量 直接使用app.globalData.key
来进行赋值和获取值。\2. 使用 路由
wx.navigateTo
和wx.redirectTo
时,可以通过在url
后 拼接 + 变量, 然后在目标页面
通过在onLoad
周期中,通过参数来获取传递过来的值。\3. 使用本地缓存
9. 简述下 wx.navigateTo()
, wx.redirectTo()
, wx.switchTab()
, wx.navigateBack()
, wx.reLaunch()
区别
wx.navigateTo()
: 保留当前页面,跳转到应用内的某个页面。但是不能跳到tabbar
页面wx.redirectTo()
: 关闭当前页面,跳转到应用内的某个页面。但是不允许跳转到tabbar
页面wx.switchTab()
: 跳转到TabBar
页面,并关闭其他所有非tabBar
页面wx.navigateBack()
: 关闭当前页面,返回上一页面或多级页面。可通过getCurrentPages()
获取当前的页面栈,决定需要返回几层wx.reLaunch()
: 关闭所有页面,打开到应用的某个页面。
10. 小程序 wx:if
和 hidden
的区别
wx:if
: 有更高的切换消耗。hidden
: 有更高的初始渲染消耗。使用
频繁切换使用
hidden
, 运行时条件变化使用wx: if
11. app.json
全局配置文件描述
pages
: 用于存放当前小程序的所有页面路径window
: 小程序所有页面的顶部背景颜色,文字颜色配置。tabBar
: 小程序底部的Tab
,最多5个,最少2个。
12. 如何封装小程序请求
封装
wx.request
请求传递需要的参数(url
,data
,method
,success 成功回调
,fail 失败回调
) , 封装常用方法POST
,GET
,DELETE
,PUT
.... 最后导出这些方法 然后新建一个api.js
文件,导入封装好的方法,然后调取相应的方法,传递数据。
wx.request 封装
var app = getApp(); //获取小程序全局唯一app实例
var host = '******************'; //接口地址
//POST请求
function post(url, data, success,fail) {
request(url, postData, "POST", doSuccess, doFail);
}
//GET请求
function get(url, data, success, fail) {
request(url, postData, "GET", doSuccess, doFail);
}
function request(url, data, method, success, fail) {
wx.showLoading({
title: "正在加载中...",
})
wx.request({
url: host + url, //请求地址
method: method, //请求方法
header: { //请求头
"Content-Type": "application/json;charset=UTF-8"
},
data: data, //请求参数
dataType: 'json', //返回数据格式
responseType: 'text', //响应的数据类型
success: function(res) {
wx.hideLoading();
//成功执行方法,参数值为res.data,直接将返回的数据传入
success(res.data);
},
fail: function() {
//失败执行方法
fail();
},
})
}
module.exports = {
postRequest: post,
getRequest: get,
}
组件使用 封装好的请求
var http = require('../../utils/request.js'); //相对路径
var params = {//请求参数
id:this.data.userId
}
http.postRequest("user/delUser", params, function(res) {
console.log("修改成功!");
}, function(res) {
console.log("修改失败!!!")
})
13. 小程序运行机制
热启动
:假如用户已经打开了某个小程序,在一定时间内再次打开小程序的话,这个时候我们就不再需要重新启动了,这需要把我们的后台打开的小程序切换到前台来使用。冷启动
:用户首次打开小程序或被微信主动销毁再次打开的情况,此时小程序需要重新加载启动。
14. 小程序什么时候会主动销毁?
小程序在进入后台之后,客户端会帮我们在一定时间内维持我们的一个状态,超过五分钟后,会被微信主动销毁.
官方也没有明确说明 什么时候销毁, 在不同机型表现也不一样,
2019年开发时:时间官方文档没有说明,但是经过询问一般指5分钟内
2020年开发时:时间官方文档没有说明,实测安卓没有固定时间,内存足够情况下,有时候一天了还在,有时候几分钟就没了。