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

数组两个数据 → 转字符串(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 最方便

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

相关推荐
用户84298142418101 小时前
ByteJS,让重要的 JavaScript 以字节码运行。
javascript
路溪非溪2 小时前
python标准库使用总结
开发语言·python
FungLeo3 小时前
成为全栈·Vue 管理后台篇·Vue Router如何守住多角色后台边界
前端·javascript·vue.js·rbac·vue router·路由守卫·前端权限
FungLeo3 小时前
成为全栈·Vue 管理后台篇·分页只显示第一页:从接口total 定位到前端修复
前端·vue.js·状态模式·分页·naive ui·服务端分页·前端问题排查
FungLeo3 小时前
成为全栈·Vue管理后台篇·仪表盘不是几张卡片:组合统计接口与角色视图
前端·javascript·vue.js·rbac·仪表盘·管理后台·tanstack query
程序员大阳3 小时前
HTML+CSS+JS对话式实战(7)-学生端活动报名功能开发
javascript·css·html·活动报名
ruanno_top3 小时前
可搜索的下拉框,键盘按不动:焦点进了下拉,事件还挂在触发器上
vue.js
SomeOtherTime4 小时前
Rust 面向对象介绍(AI回答)
开发语言·python·rust
zh_xuan4 小时前
kotlin常见面试题
开发语言·kotlin·面试题
西安小哥4 小时前
做 Agent 写到第三个小时,我开始给它算账
javascript