前言
微信小程序自定义tabbar的理解？
在app.json里面添加tabBar配置
"pages":[ "pages/index/index", "pages/logs/logs", "pages/goods/index" ], "tabBar": { "custom": true, "color": "#000000", "selectedColor": "#000000", "backgroundColor": "#000000", "list": [{ "pagePath": "pages/index/index", "text": "首页" }, { "pagePath": "pages/goods/index", "text": "商品" }] }
配置完成后，不会出现tabBar，需要在custom-tab-bar这个微信小程序已经定义的文件夹，里面添加对应的路径配置。
1. 在custom-tab-bar创建四个目录
custom-tab-bar/index.js custom-tab-bar/index.json custom-tab-bar/index.wxml custom-tab-bar/index.wxss
2. 给index.wxml添加tabBar的结构代码
<!--miniprogram/custom-tab-bar/index.wxml--> <cover-view class="tab-bar"> <cover-view class="tab-bar-border"></cover-view> <cover-view wx:for="{{list}}" wx:key="index" class="tab-bar-item" data-path="{{item.pagePath}}" data-index="{{index}}" bindtap="switchTab"> <cover-image src="{{selected === index ? item.selectedIconPath : item.iconPath}}"></cover-image> <cover-view style="color: {{selected === index ? selectedColor : color}}">{{item.text}}</cover-view> </cover-view> </cover-view>
3. 给index.js 添加数据配置 和 事件方法
Component({ data: { selected: 0, color: "#7A7E83", selectedColor: "#3cc51f", list: [{ pagePath: "/pages/index/index", iconPath: "/image/home2_icon.png", selectedIconPath: "/image/home1_icon.png", text: "首页" }, { pagePath: "/pages/goods/index", iconPath: "/image/readTrain2_icon.png", selectedIconPath: "/image/readTrain1_icon.png", text: "商品" }] }, attached() { }, methods: { switchTab(e) { console.log("执行跳转",e); const data = e.currentTarget.dataset const url = data.path wx.switchTab({url}) this.setData({ selected: data.index }) } } })
4. 给index.wxss 添加样式
此时，通过点击切换页面，就可以实现。如果在选择点击切换按钮时，页面没根据tabBar进行切换，问题很可能能在custom-tab-bar目录的index.js 的list数据配置的页面路径，一定要/开头， 如/pages/goods/index，这才能找到页面。
微信小程序怎么缓存数据？
本地数据缓存是小程序存储在当前设备上硬盘上的数据，本地数据缓存有非常多的用途，我们可以利用本地数据缓存来存储用户在小程序上产生的操作，在用户关闭小程序重新打开时可以恢复之前的状态。我们还可以利用本地缓存一些服务端非实时的数据提高小程序获取数据的速度，在特定的场景下可以提高页面的渲染速度，减少用户的等待时间。
小程序提供了读写本地数据缓存的接口，通过wx.getStorage/wx.getStorageSync读取本地缓存，通过wx.setStorage/wx.setStorageSync写数据到缓存，其中Sync后缀的接口表示是同步接口。
- wx.getStorage 异步读取本地缓存数据，使用success、fail等回调函数处理接口调用情况
// 异步读取本地缓存 wx.getStorage({ key: 'key1', success: function(res) { // 异步接口在success回调才能拿到返回值 var value1 = res.data }, fail: function() { console.log('读取key1发生错误') } })
- wx.getStorageSync 同步读取本地数据缓存，使用try…catch…处理读取的错误信息。
try{ var value2 = wx.getStorageSync('key2') }catch (e) { console.log('读取key2发生错误') }
- 读取本地数据缓存接口的参数 ：视情况选参
key：字符串类型，必填项，本地缓存中指定的key success：异步接口调用成功的回调函数 fail：异步接口调用失败的回调函数 complete：异步接口调用结束的回调函数，无论成功失败都会执行
微信小程序怎么进行网络请求？
微信小程序支持GET,POST等请求。用method可以设置.
微信小程序提供了 wx.request(Object object) 这个API，用于发送网络请求，该API接受一个对象作为参数，该对象包含多个属性，其中常用的有：
url，请求的地址，string类型，必填。 data，请求的参数，可以是一个字符串或一个对象，非必填。 method，请求的方法，string类型，默认值是"GET"。 success，请求成功的回调函数，非必填。 fail，请求失败的回调函数，非必填。
getInfo(){ vxwx.request({ url: 'https://www.escook.cn/api/get', method:'GET', data:{ name: 'zs', age:20 }, success:(res) => { console.log(res.data) } }) },
可以在时间onload中定义fuction，调用get\post网络请求
getInfo(){ vxwx.request({ url: ‘https://www.escook.cn/api/get’, method:‘POST’, data:{ name: ‘zs’, age:20 }, success:(res) => { console.log(res.data) } }) } onload: funtion(e){ postInfo()； getInfo() } postInfo(){ } getInfo(){ }
微信小程序路由跳转以及传参如何实现？
wx.switchTab(Object object)：
跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面，路径后不能带参数。
wx.reLaunch(Object object)：
关闭所有页面，打开到应用内的某个页面。
需要跳转的应用内非 tabBar 的页面的路径 (代码包路径), 路径后可以带参数。参数与路径之间使用 ? 分隔，参数键与参数值用 = 相连，不同参数用 & 分隔。例如：‘path?key=value&key2=value2’
wx.redirectTo(Object object)：
关闭当前页面，跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。可传参
wx.navigateTo(Object object)：
保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。小程序中页面栈最多十层。
wx.navigateBack(Object object)：
关闭当前页面，返回上一页面或多级页面。可通过 getCurrentPages 获取当前的页面栈，决定需要返回几层。不可路径传参，其他都可。
微信小程序生命周期的理解？
微信小程序分为：应用生命周期和页面生命周期。
- [ ] 应用生命周期
onLaunch(Object object)：小程序初始化完成时触发，全局只触发一次。参数也可以使用 wx.getLaunchOptionsSync 获取。
onShow：生命周期回调——监听小程序启动或切前台。
onHide：生命周期回调——监听小程序切后台。
- [ ] 页面生命周期
onError：错误监听函数。
onPageNotFound：页面不存在监听函数。
onUnhandledRejection：未处理的 Promise 拒绝事件监听函数。
onThemeChange：监听系统主题变化。
微信小程序模块化？
概念：
可以将一些公共的代码抽离成为一个单独的 js 文件，作为一个模块。模块只有通过 module.exports 或者 exports 才能对外暴露接口。
- exports 是 module.exports 的一个引用，因此在模块里边随意更改 exports
的指向会造成未知的错误。所以更推荐开发者采用 module.exports 来暴露模块接口，除非你已经清晰知道这两者的关系。 - 小程序目前不支持直接引入 node_modules , 开发者需要使用到 node_modules
时候建议拷贝出相关的代码到小程序的目录中，或者使用小程序支持的 npm 功能。
步骤：
- 定义模块
创建utils文件夹，并在utils文件夹下创建common.js文件
// common.js function sayHello(name) { console.log(`Hello ${name} !`) } function sayGoodbye(name) { console.log(`Goodbye ${name} !`) } module.exports.sayHello = sayHello exports.sayGoodbye = sayGoodbye
- 在需要使用这些模块的文件中，使用 require 将公共代码引入
var common = require('common.js') Page({ helloMINA: function() { common.sayHello('MINA') }, goodbyeMINA: function() { common.sayGoodbye('MINA') } })
微信小程序所有api放在哪里，简单介绍几个api？
介绍：小程序开发框架提供丰富的微信原生 API，可以方便的调起微信提供的能力，如获取用户信息，本地存储，支付功能等。详细介绍请参考 API 文档。
**小程序全局对象是: wx，所有的 API 都保存在 wx 对象中**
小程序 API 类型：
- 事件监听 API：以 on 开头，用来监听某些事件的触发
wx.onWindowResize(function callback) 监听窗口尺寸变化的事件
- 同步 API：以 Sync 结尾的 API 都是同步 API
wx.setStorageSync('key', 'value') 向本地存储中写入内容
- 异步 API：大多数 API 都是异步 API，如 wx.request，wx.login 等。这类 API 接口通常都接受一个 Object 类型的参数，需要通过 success、fail、complete 接收调用的结果。
wx.request() 发起网络数据请求，通过 success 回调函数接收数据
例如常用API：
页面跳转： wx.navigateTo（）等
设置本地存储：wx.setStorageSync(‘名’,值)
读取本地存储：wx.getStorageSync(‘名’)
用在视频滑动时： wx.createIntersectionObserver()
上传图片wx.uploadFile({
name:为上传的文件设置一个名称, url:设置上传文件的URL地址，由后台提供, filePath:设置上传文件的路径及文件名，格式为字符串, header:设置上传文件时的附加请求头数据，格式为对象, formData:设置上传文件时的附加普通数据，格式为对象, success:res=>{}
})
（1）该API方法一次只能上传1个文件。
（2）上传文件的接口必须是POST类型。 （3）上传文件时name属性时必不可少的。
微信小程序应用和页面生命周期触发顺序？
如图：
由此我们知道了小程序 程序生命周期函数和页面生命周期函数的调用顺序，这两者之间的事件顺序一般如上图所示小程序周期函数在前，页面周期函数触发在后。
微信小程序如何使用sass预编译？
1.我们可以借助 easysass 插件实现在微信开发中使用 sass
2，导入已安装的vscode扩展
微信开发者工具 视图 => 扩展 => 右侧三个点 => 导入已安装的vscode扩展，接下来打开微信开发者工具的扩展文件夹。编辑 => 打开编辑器扩展文件
3.修改 spook.easysass-0.0.6/package.json 文件中的配置
4.重启开发者工具，就 OK 了。
微信小程序开发文档界面都有哪些操作，列举几项？
开放式选答，例如：我们想要查找跳转相关api的时候，可以点击搜索，搜索路由，就可以看到关于小程序页面跳转以及传参的五种方式了。基本功能描述以及实例代码都展示的非常详尽。
