【微信开发小技巧记录】

【微信开发小技巧记录】

  • bindinput中文输入时,每个拼音触发一次
  • 表单添加自定义组件(Component)
  • 用flex布局图片空缺
  • mkdir时Permission denied

bindinput中文输入时,每个拼音触发一次

每次点击时会触发bindinput,返回的信息中value是已输入内容(包含拼音状态的字母),而cursor只包含已经确认输入的内容,即当你输入
在这里插入图片描述
的时候,value=“我shi”,而cursor=“1”而不是4
按照这种思路,只要在进行操作前判断cursor就可以了。

 let _this = this;
 var keyword = e.detail.value;
 var cursor = e.detail.cursor;
//判断cursor是否改变
 if(_this.data.cur_cursor != cursor){
     _this.data.cur_cursor = cursor;
   handle();
 }

表单添加自定义组件(Component)

当表单中包含自定义组件Component时,需要给Component添加特殊标记behaviors: ['wx://form-field'],官网也有behaviors的相关介绍,只是缺少例子查看。


<view class="container">
  <view class="suggestion">
    <view class="head">
      <input name="{{address}}" value="{{value}}" bindinput="suggestion" />
    view>
    ......//这里还有其他视图,但是只是需要将上面input传给表单,所以这里省略
  view>
view>
Component({
    behaviors: ['wx://form-field'],				1:这是要点一,标记为表单控件
    properties:{
    },
    data:{
        value:""
    },
    methods:{
    //这里touch上面视图的一个迭代列表的方法,当点击一个项时,将该项数据传给input显示
        touch:function(e){
            this.setData({
                marker:e.currentTarget.dataset.address,
                display:false,
                value:e.currentTarget.dataset.address.title		2:给该组件value赋值,该值
                												   将传递给表单提交
            });
        }
    }
});

至于添加了表单控件后会不会对组件有其他影响,暂时还不清楚。

用flex布局图片空缺

  • 情景:
    有5个图片,用flex布局,空缺使用space-between
<view class="a">
	<view class="b">...view>
	<view class="b">...view>
	<view class="b">...view>
	<view class="b">...view>
	<view class="b">...view>
view>
.a{
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	flex-wrap: wrap;
}
.b{
	width:33%;
}

【微信开发小技巧记录】_第1张图片
右边的加号图片本应该是在它左边的红框位置的

  • 处理:
    最简单的办法就是添加一个空白的了,
<view class="a">
	<view class="b">...view>
	<view class="b">...view>
	<view class="b">...view>
	<view class="b">...view>
	<view class="b">...view>
	<view wx:if="{{listB.length % 3 == 1}}" class="b">view>
	//这里的listB是前面的元素集合,毕竟只有用了列表渲染,
	//才会有不定长度,才会有缺空,固定长度情况大可以直接添加相应数量的空白
view>

这里的判断添加,是因为我刚好每行元素数量定为3,所以只可能存在一个空缺的情况
顺推单行元素:4可能是{1,2}2种情况,5可能是{1,2,3}3种情况,n可能是{1,2,3,…n-2}n-2种情况
这样的话,所要补空的个数就该用wx:for来处理了,具体个数为(n-(m%n))m为实际个数,n为单行数
m%n得到最后一行数量
n-(m%n)得到最后一行空缺数量
很明显,只要将个数补齐,就不会有空缺了
当然,这里还有一种情况,就是余1的情况,这种情况下,补不补其实看不出来,根据需要,在判断的时候添加对应判断条件即可。

mkdir时Permission denied

这种情况很明显是权限问题,网上很多会说

chmod -R 777 目录

但其实没必要,将文件夹权限归属修改下也是可行的,而且也很方便。

chown -R 用户名 目录

较详细说明可以查看另外一篇微信请求wx.request之GET***/index.php/Index/index/hello 500 (Internal Server Error),虽然不同问题,但是导致错误的原因是一样的。

你可能感兴趣的:(小技巧)