数组中有两个数据,将其变成字符串

数组两个数据 → 转字符串(3种最常用方式)

下面是直观图解 + Vue/JS 直接复制代码


1. 用逗号连接(最常用)

图示

复制代码
数组:['2026-03-01', '2026-03-23']
         ↓  join(',')
字符串:"2026-03-01,2026-03-23"

代码

js 复制代码
let arr = ['2026-03-01', '2026-03-23']
let str = arr.join(',') // 转字符串

console.log(str) 
// 输出:2026-03-01,2026-03-23

2. 用横线连接(日期范围常用)

图示

复制代码
数组:['2026-03-01', '2026-03-23']
         ↓  join(' ~ ')
字符串:"2026-03-01 ~ 2026-03-23"

代码

js 复制代码
let arr = ['2026-03-01', '2026-03-23']
let str = arr.join(' ~ ') 

console.log(str) 
// 输出:2026-03-01 ~ 2026-03-23

3. 直接拼接(自定义格式)

图示

复制代码
数组:[开始时间, 结束时间]
         ↓
字符串:开始时间 - 结束时间

代码

js 复制代码
let arr = ['2026-03-01', '2026-03-23']
let str = arr[0] + ' 至 ' + arr[1]

console.log(str) 
// 输出:2026-03-01 至 2026-03-23

你场景:Element Plus 日期范围选择器

你用的是 daterange,它的值就是两个元素的数组:

js 复制代码
const dateRange = ref(['2026-03-01', '2026-03-23'])

// 转字符串
const str = dateRange.value.join(' ~ ')

总结

  1. 数组转字符串最简单:数组.join(分隔符)
  2. 两个数据 → 字符串:join(',') join('~') 都可以
  3. 你的日期范围组件,直接用 join 最方便

需要我把它直接写到你的日期组件代码里吗?

相关推荐
冒险的豆子2 小时前
Proxy & Vue 响应式(合并精简版,适合面试)
前端·javascript·vue.js
Java后端的Ai之路3 小时前
前端技术Vue-18-视图中的渲染
前端·javascript·vue.js
zttbee10 小时前
echarts图表tooltip色块失效
前端·javascript·echarts
H.莓飛10 小时前
【数据结构】排序_OJ题(一):计数、桶与排序后的处理
java·开发语言·数据结构
wangchunyu11411 小时前
JAVA AQS与Lock实现原理(含CAS)
java·开发语言·word
虚无境12 小时前
如何用AI帮我写出实用的插件
前端·javascript·ai编程
爱喝水的鱼丶12 小时前
SAP-ABAP:ECC→S/4HANA ABAP 迁移升级指南——程序改造、语法兼容与性能优化 导语
运维·开发语言·性能优化·sap·abap·经验交流·开发交流
小灰灰搞电子12 小时前
Rust+Slint 实现FTP客户端调试助手源码分享
开发语言·后端·rust
外收内放12 小时前
面向对象高级(实战案例)
开发语言·python·学习
濮水大叔13 小时前
函数式与对象式:前端架构的两种成本曲线
vue.js·react.js·函数式编程