欢迎光临,了解微信小程序开发,就上易用通!

微信小程序开发问答《六十六》 菜单内容左右联动 & MD5加密 ...

发布:2018-04-23 12:17浏览: 来源:网络 作者:cola

1、微信小程序菜单内容左右联动
 

小程序无法获取元素的宽高,位置信息,只能通过后台计算,但是存在较大的机器误差,不知有啥好的解决方案?git地址:https://github.com/Panfen/lumm

微信小程序开发问答《六十六》 菜单内容左右联动 & MD5加密 ...(图1)

如图所以,左侧是菜单栏,右侧是主体内容,点击左侧菜单,右侧滑动到相应的位置;右侧滑动过程,也会改变左侧菜单的选中状态。本人的实现方案:

  • 所有元素大小单位用rpx;

  • 通过scrollbind(e) 的 e.detail.scrollHeight获取右侧滑动区域的总高度(单位px)

  • 通过物品高度和标题高度的比值,计算出各自的实际高度(单位px)

  • 通过修改scrollTop(单位px)改变主体内容位置

这样还是存在1px-100px的误差,物品越多,后面的累计误差会越大,有没有更好的解决办法呢?

 

答:测试了一下,的确用scroll-view的scroll-to-view特性可以解决:

 

wxml中修改:


<scroll-view scroll-y style="height: 31.5em" class="goods" bindscroll="goodsScrollAct"  scroll-into-view="{{toView}}" >
  <view class="box" id="{{item.viewId}}"  wx:for="{{allGoods}}" wx:key="unique" wx:for-index="typeId">

js文件中修改:
page data中增加:


menuType:['food','dust','bowl','cages','toys','tools'],
toView:'cages',

然后把下面函数修改一下:
selectMenuAct: function (e) {


//typename
var id = e.target.dataset.id;
var tType=this.data.menuType[id];
console.log(e),
this.setData({
  scrollNum: id,
  toView: tType
  //scrollTop: this.data.heightList[id]
});

},
测试环境下通过。

 

scroll-into-view值应为某子元素id(id不能以数字开头)。设置哪个方向可滚动,则在哪个方向滚动到该元素。

 

2、微信小程序MD5加密

一般很多语言都有MD5加密的库。

如果你指的是数据加密,怕数据明文不安全,我建议使用base64 + 一些前缀或者后缀进行加密,然后将数据传到服务器,服务器再进行解密后去掉这些前后缀。比如,明文是abc,你可以加一下前缀,变成123abc,然后加密成为MTIzYWJj再发出去,然后再解密就行了。

一般MD5加密是不可逆的。而base64可以编码解码,如下:


package main

import (
    "fmt"
    "github.com/hunterhug/GoSpider/util"
)

func main() {
    s := "abc"
    prefix := "123"
    base64e := util.Base64E(prefix + s)
    fmt.Println("加密:" + base64e)
    fmt.Println("再解密:" + util.Base64D(base64e))
}

结果


加密:MTIzYWJj
再解密:123abc

百度百科介绍:Base64编码可用于在HTTP环境下传递较长的标识信息。例如,在Java Persistence系统Hibernate中,就采用了Base64来将一个较长的唯一标识符(一般为128-bit的UUID)编码为一个字符串,用作HTTP表单和HTTP GET URL中的参数。在其他应用程序中,也常常需要把二进制数据编码为适合放在URL(包括隐藏表单域)中的形式。此时,采用Base64编码不仅比较简短,同时也具有不可读性,即所编码的数据不会被人用肉眼所直接看到。

我的Golang语言自己封装的加密库一般是这样的:


/*
Copyright 2017 by GoSpider author.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
    https://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/

package util

import (
    "crypto/hmac"
    "crypto/md5"
    "crypto/sha256"
    "encoding/base64"
    "encoding/hex"
    "fmt"
    "net/url"
    "strings"
)

// HMAC with the SHA256  https://blog.csdn.net/js_sky/article/details/49024959
func ComputeHmac256(message string, secret string) string {
    key := []byte(secret)
    h := hmac.New(sha256.New, key)
    h.Write([]byte(message))
    return base64.StdEncoding.EncodeToString(h.Sum(nil))
}

// create md5 string
func Strtomd5(s string) string {
    h := md5.New()
    h.Write([]byte(s))
    rs := hex.EncodeToString(h.Sum(nil))
    return rs
}

func Md5(str string) string {
    return Strtomd5(str)
}

// 字符串base64加密
func Base64E(urlstring string) string {
    str := []byte(urlstring)
    data := base64.StdEncoding.EncodeToString(str)
    return data
}

// 字符串base64解密
func Base64D(urlxxstring string) string {
    data, err := base64.StdEncoding.DecodeString(urlxxstring)
    if err != nil {
        return ""
    }
    s := fmt.Sprintf("%q", data)
    s = strings.Replace(s, "\"", "", -1)
    return s
}

//url转义
func UrlE(s string) string {
    return url.QueryEscape(s)
}

//url解义
func UrlD(s string) string {
    s, e := url.QueryUnescape(s)
    if e != nil {
        return e.Error()
    } else {
        return s
    }
}

现在大部分站点都开启https来保证数据安全。






免责声明:本站所有文章和图片均来自用户分享和网络收集,文章和图片版权归原作者及原出处所有,仅供学习与参考,请勿用于商业用途,如果损害了您的权利,请联系网站客服处理。