用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
  • TA的每日心情
    慵懒
    2017-1-6 10:46
  • 签到天数: 2 天

    [LV.1]初来乍到

    173

    主题

    181

    帖子

    945

    金钱

    咫尺尊享

    Rank: 5Rank: 5

    积分
    0
    2017-1-9 20:01:41 柿霖不是林 咫尺尊享 楼主 142305


    一个微信小程序版的汇率计算器。练手项目,主要是为了学习微信小程序开发。

    交互参考了极简汇率

    界面及计算的部分代码参考了sCalc

    Description

    涉及微信小程序开发相关知识:

    • CSS Flexbox布局
    • Page、window、App全局设置,wxml、wxsss、js、json文件使用方法
    • 事件绑定、页面跳转
    • 数据缓存、数据绑定等API
    代码示例:


    [HTML] 纯文本查看 复制代码
    //index.js
     
    var cName = require('../../utils/currencyNames');
     
    //获取应用实例
    var app = getApp()
            Page({
                data: {
                    progressTip: ''
                },
                    onLoad : function (options) {
                        // 页面初始化 options为页面跳转所带来的参数
                    },
                    onReady : function () {
                        // 页面渲染完成
                    },
                    onShow : function () {
                        // 页面显示
     
     
                        this.setData({
                            "progressTip": "正在刷新汇率列表..."
                        });
     
                //1.加载汇率列表
                        var that = this;
                        wx.request({
                            url: app.globalData.fixerApi,
                            data: {},
                            method: 'GET',
                            success: function (res) {
                                //如何解析yahoo api传回来的xml??
                                // success
                                if (res.statusCode == 200) {
     
                                    //补充一个USD做基准利率
                                    res.data.rates.USD = 1.0000;
     
                                    wx.setStorageSync('cRates', res.data.rates);
     
                                    //2.加载货币名称列表
                                    //TODO:可能要从其他api获取,這里暂时用静态文件代替
                                    that.setData({
                                        "progressTip": "正在刷新货币名称..."
                                    });
                                    wx.setStorageSync('cNames', cName.names);
     
                                    //3.读取用户本地存储的已选货币列表
                                    //如果没有,就默认填入四个
                                    that.setData({
                                        "progressTip": "检查已选货币..."
                                    });
                                    var selectCurrencyList = wx.getStorageSync('selectCurrencyList') || []
                                    if (selectCurrencyList.length == 0) {
                                        selectCurrencyList = [
                                    { id: 0, currencyNameEN: "CNY", currencyCal: "", currencyValue: 0, currencyNameCN: cName.names["CNY"] },
                                    { id: 1, currencyNameEN: "HKD", currencyCal: "", currencyValue: 0, currencyNameCN: cName.names["HKD"] },
                                    { id: 2, currencyNameEN: "USD", currencyCal: "", currencyValue: 0, currencyNameCN: cName.names["USD"] },
                                    { id: 3, currencyNameEN: "JPY", currencyCal: "", currencyValue: 0, currencyNameCN: cName.names["JPY"] },
                                        ];
     
                                        wx.setStorageSync('selectCurrencyList', selectCurrencyList);
                                    }
                                     
                                    //4.读取用户本地存储的默认选中货币Id
                                    //如果没有,默认为2
                                    var highlightedId = wx.getStorageSync('highlightedId') || 0;
                                    if (highlightedId == 0) {
                                        highlightedId = 2;
     
                                        wx.setStorageSync('highlightedId', highlightedId);
                                    }
     
     
                                    //5.所有准备工作完成,redirect到main
                                    that.setData({
                                        "progressTip": "正在载入首页..."
                                    });
                                    wx.redirectTo({
                                        url: '../main/main'
                                    })
     
                                }
                                console.log(res);
                            },
                            fail: function () {
                                // fail
                            },
                            complete: function () {
                                // complete
                            }
                        })
                    },
                    onHide : function () {
                            // 页面隐藏
                    },
                    onUnload : function () {
                            // 页面关闭
                    }
            })



    游客,如果您要查看本帖隐藏内容请回复

    本帖子中包含更多资源

    您需要 登录 才可以下载或查看,没有帐号?立即注册

    x
    使用道具 举报 回复
    啥也不说了,感谢楼主分享哇!
    休息休息
    使用道具 举报 回复
    正需要,支持楼主大人了!
    初级但有用的东西!
    感谢楼主分享
    有制作教程么
    正需要,谢谢楼主
    感谢感谢感谢感谢感谢

    正需要,支持楼主大人了!
    12下一页
    发新帖
    *滑动验证:
    您需要登录后才可以回帖 登录 | 立即注册
    咫尺论坛|小程序开发社区
    X