一、日期选择器入门小程序 npm
实现一个日历选择器为例：
- app.js 同级目录下，创建依赖文件 package.json 文件：
npm init -y
安装 datepicker
npm install --save miniprogram-datepicker
构建 npm，只有构建小程序才能使用：
构建之后必须，使用 npm ：
- 在需要使用 datepicker 的页面 page.json 中添加 datepicker 自定义组件配置
{
"usingComponents": {
"datepicker": "miniprogram-datepicker"
}
}
- WXML 文件中引用 datepicker
<view>你选择的公历为：{{solar}}</view>
<datepicker value="{{solar}}" bindchange="bindSolarChange">
<button type="default">公历</button>
</datepicker>
<view>你选择的农历为：{{lunar}}</view>
<datepicker value="{{lunar}}" chinese="{{true}}" bindchange="bindLunarChange">
<button type="default" class="weui-btn">农历</button>
</datepicker>
- 页面 js 文件书写处理函数
Page({
bindLunarChange(e){
this.setData({
lunar: e.detail.value
});
},
bindSolarChange(e){
this.setData({
solar: e.detail.value
});
},
/**
* 页面的初始数据
*/
data: {
solar:'',
lunar:''
}
});
演示效果
二、演示 js-base64
js-base64
安装;
npm install --save js-base64
注意：每次安装新的 npm 都必须构建 npm。
page.js 里面使用：
import { Base64 } from 'js-base64';
let atob = Base64.encode('My name is Condor Hero');
let btoa = Base64.decode(atob);
console.log(atob);
console.log(btoa);
打印结果：
小程序不仅支持 ES6 还支持NodeJs的文件引入方式，下面的也是可行的：
const {Base64} = require('js-base64');
let atob = Base64.encode('My name is Condor Hero');
let btoa = Base64.decode(atob);
console.log(atob);
console.log(btoa);
三、vant weapp 框架起步
Vant Weapp 是移动端 Vue 组件库 Vant 的小程序版本，两者基于相同的视觉规范，提供一致的 API 接口，助力开发者快速搭建小程序应用。
安装依赖：
npm i @vant/weapp -S --production
--production 可减少安装不必要的依赖，也九十只安装 dependencies的依赖不安装 devDependencies 里面的依赖。
构建 npm 。
使用 button 按钮，在 page.json 文件里面引入组件：
"usingComponents": {
"van-button": "@vant/weapp/button"
}
引入组件后，可以在 wxml 中直接使用组件
<van-button type="primary">按钮</van-button>
演示效果
四、日期处理 moment
- 安装依赖：
npm install moment -S
- 构建 npm
- 页面的 page.js 使用：
import moment from 'moment';
console.log(moment().format('YYYY年MM月DD日'));
console.log(moment('2000-10-01').format('YYYY年MM月DD日'));
演示结果：
