ThinkCMF开发经验
作者：互联网
一、利用JavaScript展示图片
<img onclick="javascript:imagePreviewDialog('{:cmf_get_image_preview_url($value[\'a\'])}')" src = "{:cmf_get_image_preview_url($value['b'])}" style="max-height: 60px;max-width: 60px"/>
二、前端图片上传操作
<div class="form-group">
<div class = "pic_num_one" style="display: none">
<label for="banner" class="col-sm-2 control-label"><span class="form-required">*</span>弹窗图片</label>
<div class="col-sm-10">
<div style="margin-bottom: 10px">
<input type="text" class="form-control" id="banner" name="banner"
style="display:none;" value="{$data['banner']}">
<a class="btn btn-primary"
href="javascript:uploadOneImage('图片上传','#banner');">上传图片</a>
<span style="margin-left: 10px">只能上传{:cmf_get_upload_setting()['file_types']['image']['extensions']}格式文件，文件不能超过{:intval(cmf_get_upload_setting()['file_types']['image']['upload_max_filesize'])/2048}MB</span>
</div>
<div>
<img id="notification_banner-preview" style="max-width:150px"
<notempty name="data">
src="{:cmf_get_image_preview_url($data['banner'])}"
</notempty>
/>
<br>
<br>
</div>
</div>
</div>
该操作可以默认展示后端传回的图片url，并允许个人上传的图片url的数据发送给后端
三、利用JavaScript语言，使得前端页面可以随着按钮的点击而变换样式
html的代码为：
<div class="form-group">
<label for="type" class="col-sm-2 control-label"><span class="text-center" style="color: #ff0000;">*</span>类型</label>
<div class="col-md-6" id="type">
<label class="radio-inline">
<input type="radio" name="type" value="1"<if condition="$notification_data.type eq 1">checked</if>>类型1
</label>
<label class="radio-inline">
<input type="radio" name="type" value="2"<if condition="$notification_data.type eq 2">checked</if>>类型2
</label>
</div>
</div>
<div class="form-group pic_num_one" style="display: none;margin-left:0 ">
<label for="title" class="col-sm-2 control-label"><span class="form-required">*</span>弹窗标题</label>
<div class="col-sm-10">
<textarea type="text" class="form-control" id="title" name="title"
placeholder="请输入" style="width:300px;height:120px;display:inline-block;">{$notification_data['notification_title']}</textarea>
</div>
</div>
<div class="form-group pic_num_two" style="display: none;margin-left:0">
<label for="desc" class="col-sm-2 control-label"><span
class="form-required">*</span>横幅文案</label>
<div class="col-sm-10">
<textarea type="text" class="form-control" id="desc_1" name="desc_1"
placeholder="请输入" style="width:300px;height:120px;display:inline-block;">{$notification_data['notification_desc_1']}</textarea>
</div>
</div>
JavaScript的代码为：
<script>
let pic_num = $('input[name="type"]:checked').val();
if (pic_num === '1') {
$('.pic_num_one').hide();
$('.pic_num_two').show();
} else if (pic_num === '2') {
$('.pic_num_one').show();
$('.pic_num_two').hide();
}
$('input[name="type"]').off('click').on('click', function(){
let pic_num = $('input[name="type"]:checked').val();
if (pic_num === '1') {
// $('.pic_num_one').show();
$('.pic_num_one').hide();
$('.pic_num_two').show();
} else if (pic_num === '2') {
// $('.pic_num_one').hide();
$('.pic_num_one').show();
$('.pic_num_two').hide();
}
})
</script>
四、给后端的控制器传入参数
<a class="btn btn-sm btn-primary" href="{:url('GamefiLotteryNotification/editLotteryNotification',array('id'=>$data['id']))}">编辑</a>
url为后端的控制器的方法，array可以当作参数传递给后端
$params = $this->request->param();
五、利用Javascript获取当前页面中的文本框的值，如果需要的话可以传递给后端
<script>
function getPreview () {
var nft_file_url = document.getElementById("nft_file");// 这些是上述表单中的id
var contract_id = document.getElementById("contract_id");// 这些是上述表单中的id
var creator_uids = document.getElementById("creator_uids"); // 这些是上述表单中的id
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("nft_info").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open('POST', "{:url('GamefiContract/nftPreview')}", true);
// 3.5 POST发送请求必须设置请求头
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.send("nft_file_url="+nft_file_url.value+"&creator_uids="+creator_uids.value);
// xmlhttp.open("GET","{:url('PresaleList/nftPreview')}",true);
// xmlhttp.send();
}
</script>
后端可以接受此参数：
$params = $this->request->param();
六、使用ImagIck获取图像的主色所存在的问题。
$R = dechex($this->colorArr[0]['r']); // 这样获得的红色值的字符串长度可能只有一位
$G = dechex($this->colorArr[0]['g']); // 这样获得的绿色值的字符串长度可能只有一位
$B = dechex($this->colorArr[0]['b']); // 这样获得的蓝色值的字符串长度可能只有一位
$dominantColor = $R . $G . $B; // 因为需要把上述的三个变量进行前缀补足
$R = dechex($this->colorArr[0]['r']);
$G = dechex($this->colorArr[0]['g']);
$B = dechex($this->colorArr[0]['b']);
if(strlen($R) == 1) {
$R = '0'.$R; // 避免字符串前导0被自动损失的问题
}
if(strlen($G) == 1) {
$G = '0'.$G;
}
if(strlen($B) == 1) {
$B = '0'.$B;
}
$dominantColor = $R . $G . $B;
七、对进行查表的结果分析(判空的问题)
empty("0") //true;
empty("0.0000") false;
八、对查表操作尽量开启事务
$Model->startTrans();
try {
$result = $Model->where([['id', '=', $requestData['id']]])->update($updateData);
if (!$result){
$Model->rollback();
return ['code' => -1, 'msg' => "操作失败"];
}
$result = (new GamefiContractModel())->where([['id', '=', $requestData['id']]])->update($update); // update操作返回的结果比较重要
if (!is_int($result)){
$Model->rollback();
return ['code' => -1, 'msg' => "操作失败"];
}
$Model->commit();
return ['code' => 1, 'msg' => "操作成功"];
} catch(\Exception $e){
$Model->rollback();
return ['code' => -1, 'msg' => sprintf('操作异常，请重试：ERROR %s', $e->getMessage())];
}
标签：经验,xmlhttp,url,ThinkCMF,pic,dechex,num,开发,id 来源： https://www.cnblogs.com/success-zh/p/16612917.html