小程序——单列和多列picker选择器(二)
在我的另一篇博文中已经提到了要解决的第一个问题在未选择时展示引导内容在下拉栏选择后显示选择内容现在来解决第二个问题存入值为文本值而不是角标一、单列选择器和多列选择器相比单列选择器的处理相对简单些我们先看下微信开放文档picker中让页面显示为文字而不是角标的处理方式view classpicker 当前选择{{array[index]}} /view可以看出index是下角标显示文字时是以数组的形式array[0],array[1]等所以为了让数据库中存入的是文字形式我们可以把这部分内容在js中进行处理附上xml和js代码xmlview classaddorder_99 picker nameOtime bindchangebindPickerChangetimevalue{{indextime}} range{{arraytime}} view classaddorder_88 view class{{indextime!-1?on:}} style{{(indextime!-1)?color:black:color:#C0C0C0}} {{indextime!-1?indextime:请选择送达时间}} /view /view /picker /viewjsbindPickerChangetime: function (e) { console.log(picker发送选择改变携带值为, this.data.arraytime[e.detail.value]) this.setData({ indextime: this.data.arraytime[e.detail.value] }) },可以在控制台中看到输出的直接为值的形式注意触发了绑定事件bindPickerChangetime以后对indextime的值进行了改变注意此时改变的是value{{indextime}}中的值也就是要做到和value对应否则会出现存储错误e.detail.value是数组下标在js函数中已通过类似数组的形式进行了文字的转换二、多列选择器以两列选择器为例view classpicker 当前选择{{multiArray[0][multiIndex[0]]}}{{multiArray[1][multiIndex[1]]}}{{multiArray[2][multiIndex[2]]}} /view通过开放文档中的示例我们可以看出多列选择器无法直接使用在js中直接处理的方式以multiArray[0][multiIndex[0]]为例multiArray[0]代表的是第一列multiIndex[0]是判断选择选择了什么也就是只知道数组下标。multiArray[0]相当于array[index]中的arraymultiIndex[0]相当于index因为多列选择器绑定的是两个函数一个作为最终的结果处理一个具体分析选择的是哪一列以及选中列对应的内容再加上value{{multiIndex}所以只能返回数组的形式然后在后端进行处理附代码xml注 三目运算符的书写方式见我另一篇博文 在未选择时展示引导内容在下拉栏选择后显示选择内容view classaddress_3 picker nameAarea modemultiSelector bindchangebindMultiPickerChangeaddr bindcolumnchangebindMultiPickerColumnChangeaddr value{{multiIndexaddr}} range{{multiArrayaddr}} view classaddress_5 view class{{(multiIndexaddr[0]||multiIndexaddr[1])0?on:}} style{{(multiIndexaddr[0]||multiIndexaddr[1])!-1?color:black:color:#C0C0C0}} {{(multiIndexaddr[0]||multiIndexaddr[1])0?multiArrayaddr[0][multiIndexaddr[0]]-multiArrayaddr[1][multiIndexaddr[1]]:送达地点}} /view /view /picker /viewjsbindMultiPickerChangeaddr: function (e) { console.log(picker发送选择改变携带值为, e.detail.value) console.log(this.data.multiArrayaddr[0][[e.detail.value[0]]]), console.log(this.data.multiArrayaddr[1][[e.detail.value[1]]]), this.setData({ multiIndexaddr: e.detail.value }) }, bindMultiPickerColumnChangeaddr: function (e) { console.log(修改的列为, e.detail.column, 值为, e.detail.value); var data { multiArrayaddr: this.data.multiArrayaddr, multiIndexaddr: this.data.multiIndexaddr }; data.multiIndexaddr[e.detail.column] e.detail.value; switch (e.detail.column) { case 0: switch (data.multiIndexaddr[0]) { case 0: data.multiArrayaddr[1] [桂园, 榴园, 李园, 梅园, 桃园, 杏园, 橘园]; break; case 1: data.multiArrayaddr[1] [涓苑, 清苑, 浩苑, 鸿苑, 瀚苑, 溪苑, 澈苑]; break; } data.multiIndexaddr[1] 0; break; } console.log(data.multiIndexaddr); this.setData(data); },看下控制台信息输出控制台虽然写的是[0,0]这样的形式但是后台输入保存时为0,0可以在php中进行echo也就是字符串的形式在php中进行值的转化php$Aarea$_POST[Aarea]; //这句是前端中picker nameAarea $area substr($Aarea,0,strrpos($Aarea,,)); $dormitory substr($Aarea,strripos($Aarea,,)1); if ($area0) { $area北区; if ($dormitory0) $dormitory桂园; elseif ($dormitory1) $dormitory榴园; elseif ($dormitory2) $dormitory李园; elseif ($dormitory3) $dormitory梅园; elseif ($dormitory4) $dormitory桃园; elseif ($dormitory5) $dormitory杏园; elseif ($dormitory6) $dormitory橘园; } if ($area1){ $area南区; if ($dormitory0) $dormitory涓苑; elseif ($dormitory1) $dormitory清苑; elseif ($dormitory2) $dormitory浩苑; elseif ($dormitory3) $dormitory鸿苑; elseif ($dormitory4) $dormitory瀚苑; elseif ($dormitory5) $dormitory溪苑; elseif ($dormitory6) $dormitory澈苑; } $Aarea$area.-.$dormitory; mysqli_query($con,set names utf8);关键代码$area substr($Aarea,0,strrpos($Aarea,,)); $dormitory substr($Aarea,strripos($Aarea,,)1);参考资料php处理根据标点处理字符串在上文已经说过传进来是字符串且用,进行分割注意这里是英文的,只要把变量名对应好就能做处理和分割如果是多列选择器可以采用多次划分的形式$Aarea$area.-.$dormitory;这句代码是让$Aarea的值进行重新的组合因为我想让数据库中存入的是 北区-桂园的形式 如果想存入北区桂园 代码应当写为$Aarea$area..$dormitory;也就是想让怎么连接就在两个.直接填写什么参考资料如何在PHP中将两个字符串组合在一起mysqli_query($con,set names utf8);是保证存入数据库为中文字符而不是或者拉丁文的形式。

相关新闻

功率计读数偏低?先别送修,查查探头校准

功率计读数偏低?先别送修,查查探头校准

做射频测试的人都遇到过这种情况:功率计测出来的数值,怎么比预期低了好几个 dB?换个信号源还是低,换根电缆还是低,甚至换台主机都一样 —— 难道探头坏了?很多人第一反应是 "功率计不准了,得送修"。但实际…

2026/7/28 16:50:39 阅读更多 →
Blueman蓝牙管理器:Linux桌面蓝牙管理的终极解决方案

Blueman蓝牙管理器:Linux桌面蓝牙管理的终极解决方案

Blueman蓝牙管理器:Linux桌面蓝牙管理的终极解决方案 【免费下载链接】blueman Blueman is a GTK Bluetooth Manager 项目地址: https://gitcode.com/gh_mirrors/bl/blueman 在Linux桌面环境中管理蓝牙设备常常让人感到头疼,特别是当你需要连接音…

2026/7/28 16:50:39 阅读更多 →
高帧率视频素材哪里找?2026年适合高频创作团队的5个网站

高帧率视频素材哪里找?2026年适合高频创作团队的5个网站

引言:视频产量提高后,素材效率比单纯数量更重要IAB在2026年行业研究中指出,接近三分之二的数字视频广告买家已经在创意制作中使用生成式AI,高于2025年的约一半;与此同时,93%的买家认为直播内容具有更高价值…

2026/7/28 16:50:39 阅读更多 →

最新新闻

物联网设备硬件级安全方案与SE050安全元件实践

物联网设备硬件级安全方案与SE050安全元件实践

1. 为什么物联网设备需要硬件级安全方案在智能家居和工业物联网项目中,开发者常常面临一个两难选择:使用低成本MCU(如PIC18系列)可以控制预算,但这类芯片往往缺乏足够的安全防护能力。去年某智能锁厂商的教训就很典型—…

2026/7/28 16:59:43 阅读更多 →
物联网安全芯片SE050与MCU协同设计实践

物联网安全芯片SE050与MCU协同设计实践

1. 为什么物联网设备需要专用安全芯片?在智能家居和工业物联网项目中,开发者常面临一个两难选择:使用通用MCU实现基础安全功能(如软件加密),还是部署专用安全芯片?我曾参与过一个智能电表项目&a…

2026/7/28 16:59:43 阅读更多 →
别再用Notebook拼接AI流程了!用这6个工业级组件重构可复用、可监控、可回滚的工作流

别再用Notebook拼接AI流程了!用这6个工业级组件重构可复用、可监控、可回滚的工作流

更多请点击: https://codechina.net 第一章:AI工作流重构的必要性与核心挑战 随着大模型推理成本下降、多模态能力增强及开源工具链成熟,传统以单点模型调用为核心的AI工作流正面临系统性瓶颈。企业级AI应用不再满足于“一次请求—一次响应”…

2026/7/28 16:59:43 阅读更多 →
飞书远程控机:9步搞定Windows智能操控

飞书远程控机:9步搞定Windows智能操控

本文将系统介绍如何通过 OpenClaw 工具接入飞书开放平台,并配置智能机器人来实现对 Windows 电脑的远程控制。文章将重点阐述文件管理、程序启动等核心功能的具体实现方案,同时提供完整的配置步骤详解及常见问题排查指南。 一、使用前提说明 1. 系统要…

2026/7/28 16:59:43 阅读更多 →
告别命令行踩坑!Hermes Windows 一键整合包,3 步搭建本地桌面 AI 自动化智能体

告别命令行踩坑!Hermes Windows 一键整合包,3 步搭建本地桌面 AI 自动化智能体

🔍前言 对于希望体验 Hermes Agent 强大办公能力的 AI 工具用户而言,复杂繁琐的环境配置往往构成了较高的上手门槛。从手动安装依赖、调整系统路径,到处理命令行报错、修复权限异常、补全缺失的核心文件……这一系列技术难题,使得…

2026/7/28 16:59:43 阅读更多 →
HR与算法工程师必须协同解决的简历筛选困局(2024最新Bias审计框架首次公开)

HR与算法工程师必须协同解决的简历筛选困局(2024最新Bias审计框架首次公开)

更多请点击: https://codechina.net 第一章:HR与算法工程师协同治理的必要性与底层逻辑 在AI驱动组织变革的当下,算法系统已深度嵌入招聘筛选、绩效评估、人才画像等核心HR流程。当算法模型自动拒掉高潜力候选人,或因历史数据偏差…

2026/7/28 16:58:43 阅读更多 →

日新闻

告别臃肿!3步让你的暗影精灵笔记本重获新生

告别臃肿!3步让你的暗影精灵笔记本重获新生

告别臃肿!3步让你的暗影精灵笔记本重获新生 【免费下载链接】OmenSuperHub Control Omen laptop performance, fan speeds, and keyboard lighting, and unlock power limits. 项目地址: https://gitcode.com/gh_mirrors/om/OmenSuperHub 你是否也曾为官方Om…

2026/7/28 0:00:43 阅读更多 →
RAG必踩坑!财报法规检索不准?这款开源工具让答案浮出水面,准确率飙升98.7%!

RAG必踩坑!财报法规检索不准?这款开源工具让答案浮出水面,准确率飙升98.7%!

做 RAG 的人应该都踩过这个致命的坑:把几百页的财报、法规、技术手册扔给向量库,问一个具体问题,搜出来的全是沾边但没用的内容 —— 关键信息要么被硬切块拆碎了,要么藏在几十条结果的最下面。语义相似≠真正相关,这个…

2026/7/28 0:00:43 阅读更多 →
抖音视频文案提取工具全指南:免费2026版、手机App、在线工具一网打尽

抖音视频文案提取工具全指南:免费2026版、手机App、在线工具一网打尽

2026年做短视频运营,从抖音上扒文案早就不是偷偷抄笔记的事了。我刚开始做内容的时候,每天刷半小时抖音,手动把爆款视频的口播敲进备忘录,一条2分钟的视频得花十来分钟,碰到语速快的还要反复回听。后来试了一圈工具&am…

2026/7/28 0:00:43 阅读更多 →

周新闻

深度学习道路桥梁裂缝检测系统 道路桥梁裂缝检测数据集 道路桥梁病害识别检测数据集

深度学习道路桥梁裂缝检测系统 道路桥梁裂缝检测数据集 道路桥梁病害识别检测数据集

深度学习道路桥梁裂缝检测系统 数据集6000张 完整源码已标注数据集训练好的模型环境配置教程程序运行说明文档,可以直接使用!系统支持图片、视频、摄像头等多种方式检测裂缝,功能强大实用。 1数据集6000张 8各类别

2026/7/28 12:04:22 阅读更多 →
深度学习YOLO模型如何训练 PUBG 绝地求生目标检测数据集

深度学习YOLO模型如何训练 PUBG 绝地求生目标检测数据集

pubg数据集 精选原图1.42万数据 1.49万标签 无任何重复、算法增强或冗余图像! pubg绝地求生目标检测数据集 1分类:e_body,14905个标签,txt格式 共计14244张图,99%为640*640尺寸图像 适合yolo目标检测、AI训练关键词&am…

2026/7/28 8:29:16 阅读更多 →
Apex英雄目标检测数据集 深度学习框架YOLO如何训练APEX数据集

Apex英雄目标检测数据集 深度学习框架YOLO如何训练APEX数据集

Apex检测数据集数据集详情检测类别: allies enemy tag图片总量:7247张训练集:5139张验证集:1425张测试集:683张标注状态:全部已标注,即拿即用数据格式:支持YOLO格式及其他格式&#…

2026/7/28 5:03:42 阅读更多 →

月新闻