发帖
做个简单的wxml页面
<view class='by'>
<view class='sct'>发表您的评论</view>
<view class='sccv'>
<textarea placeholder='请输入评论内容' minlength="{{min}}" maxlength="{{max}}" class='scct' bindinput='inp'></textarea>
<text class='scm' >{{texts}}</text>
<text class='ctn' >{{currentwordNumber}}/{{max}}</text>
</view>
<view class='ctit' >上传图片<text>(长按图片删除)</text><text >{{imn}}/{{immax}}</text></view>
<view class='ci' >
<block wx:for="{{images}}">
<image src='{{item}}' data-in='{{[index]}}' class='cimage' mode='widthFix' bindlongtap='dimage'></image>
</block>
<image src='../../image/icon/upl.png' class='cimage' mode='widthFix' bindtap='chose'></image>
</view>
<view style='background:white;font-size: 30rpx;color: #03bc03;padding:0 0 0 2%;'>{{em}}</view>
<view style='background:white;' wx:if="{{fail!=0}}" >失败{{fail}}个</view>
<view class='vbt' >
<view class='vbtc' bindtap='cancel'>取消</view>
<view class='vbts' bindtap='save'>保存</view>
</view>
</view>
页面大致这个样子
小的美术不行望看官们见谅
完后就是js了,这里实现了限制字数,字数实时提醒,上传图片
bindinput事件
inp: function(e) {
var _this = this;
var value = e.detail.value;
_this.setData({
value: value,
})
var len = parseInt(value.length);
if (len <= this.data.min)
this.setData({
texts: "加油,3个字不是很多"
})
else if (len > this.data.min)
this.setData({
texts: " "
})
if (len > this.data.max) return;
this.setData({
currentWordNumber: len //当前字数
});
},
添加图片事件关于comm.js上篇小程序笔记(三)模仿企鹅社区给予用户,灵活发帖展示自我的操作有说
chose: function() {
var _this = this;
var imagesc = _this.data.images;
comm.choosephoto().then(function(res) {
if ((imagesc.length + res.tempFilePaths.length) <= _this.data.immax) {
for (var i = 0; i < res.tempFilePaths.length; i++) {
imagesv.push(res.tempFilePaths[i]);
}
_this.setData({
images: imagesc.concat(imagesv),
imn: Number(imagesc.length) + Number(res.tempFilePaths.length),
em: "",
});
imagesv = [];
} else {
_this.setData({
em: "最多上传" + _this.data.immax + "张图片",
})
}
});
},
长按删除事件
dimage: function(e) {
var _this = this;
imagesv = [];
var images = _this.data.images;
var imn = _this.data.imn;
wx.showModal({
title: '提示',
content: '确认删除图片吗',
success: function(res) {
if (res.confirm) {
images.splice(e.currentTarget.dataset.in[0], 1);
_this.setData({
images: images,
imn: imn - 1,
})
} else if (res.cancel) {}
}
});
},
好搞定,看下效果图
就是这样子,可能小的美术不好,有点难看,希望不要介意
相关阅读
正确解决 应用程序无法正常启动(0xc000007b)的问题
【问题背景】用vs2008写了一个MySql(MySQL的版本号:8.0.11.0)的测试程序,在搞定MySQL所需要的x64平台后,问题又来了:编译一切都好,就是在
漫游了ip地址,宿舍,毕设室来回换,真费劲。写了一个.bat文件进行ip的更换,分享给大家。将以下代码复制,保存为.txt文档,方便一会儿修改
Excel 宏编程-第一个Hello World程序,实战演示!
先看大屏幕,我要演示的效果就是点击hello按钮,运行我们的宏,输出Hello World!第一步 首先进入开发工具页签,点击宏,创建一个的宏,我起的
import java.util.Scanner; public class ComputeArea {//从控制台输入圆的半径,输出圆的面积 public static void main(String[
笔者此次由于需要做数据分析,所以写了一份儿爬虫,爬取新浪微博的微博评论和评论人信息以及转发情况和转发后的点赞情况。 爬取新浪