2018-05-07

小程序

[18-05-31]小程序button样式重置问题
[18-05-23]小程序camera组件iphone X适配
[18-05-19]消除文本内容的最后一个的letter-spacing
[18-05-16]中文(简体&繁体)正则
[18-05-09]如何获取特殊字符的unicode编码,并把它在字符串中移除
[18-05-07]如何在页面中调用自定义组件中的方法

[18-05-31]小程序button样式重置问题

小程序按钮的边框使用button:after来实现的,所以有时候要直接重置border样式的时候,会出现类似看到两个边框的情况.

之前版本的开发者工具是能看到button的伪类信息的,但是现在好想看不到了,如果要选择性重置按钮样式的话,可能需要上网查一下关键字小程序按钮伪类.

<!-- 直接置空 -->
button:after {
  display: none;
  content: none;
}

[18-05-23]小程序camera组件iphone X适配

在使用camera组件时希望组件填满整个屏幕(除了导航栏),在iphone X上有上下边距,但是调试的时候发现整个camera组件高度的确是100%,如果还要使用cover-view来根据camera来布局的话可能在真机会出现定位失误.

<camera device-position="front" flash="off" binderror="error" style="width: 100%; height: 100%;">
  <!-- 解决办法是用一个最外层的cover-view来定位到camera的具体区域, 然后在该cover-view上进行其他cover-view的布局 -->
  <!-- 至于为什是125rpx和1200rpx,这个没有找到说明,我是在真机上一点一点调出来的 -->
  <!-- 如果有小伙伴有看过相关资料的,跪求告知啊! -->
  <cover-view style="top: ;height:;width:100%;"></cover-view>
</camera>

[18-05-19]消除文本内容的最后一个的letter-spacing

letter-spacing是用来设置字间距的属性,实现的方法是在每一个字符后面加上间距,这样的话最后一个字符后面也会多出来间距.消除的方法就是设置一个负的margin

.letter-spacing {
  letter-spacing: 1em;
  margin-right: -1em;
}

[18-05-16]中文(简体&繁体)正则

下列方法没经过严格测试

function isHZ(value) {
  return /^\u4E00-\u9FCF$/.test(value);
}

function unicodeToChar (codeNumber) {
  // codeNumber = unicode without '\u', String
  var code = parseInt(codeNumber, 16);
  return String.fromCharCode(code);
}
unicodeToChar('4E00'); // 一
unicodeToChar('9FCF'); // 鿏

[18-05-09]如何获取特殊字符的unicode编码,并把它在字符串中移除

String.prototype.removeCode = String.prototype.removeCode || function (code) {
  var hex = code.codePointAt(0).toString(16);
  var result = "\\u" + "0000".substring(0, 4 - hex.length) + hex;

  return this.replace(new RegExp(result, 'g'), '');
}

var a = "asd▄asd";
a.removeCode('▄');
console.log(a); // "asdasd"

[18-05-07]如何在页面中调用自定义组件中的方法

// page.wxml
<custom-component id="custom-component"></custom-component>

// page.js
const comp = this.selectCompoent('#custom-component');

comp.compFunc();

奇怪的是这个api在文档几乎没有提到过