uniapp数组转成json字符串

简介: 本文主要通过JSON.stringify和replace方法来对数组进行JSON格式化处理.

前言


本文主要通过JSON.stringifyreplace方法来对数组进行JSON格式化处理.


一、准备工作


准备一个list数组,例:


export default {
  data() {
    return {
      list:[],
      mark:[
        {id:1,mark:2}
      ]
    }
    },
    onLoad(){
      this.list.push({
        courseIds:"123",
        mark:this.mark,
      })
    }
}


在上述代码中,我们准备了一个数组并且push进去两个字段,分别为courseIds和mark.


二、具体实现


1.实现过程


首先我们用JSON.stringify内置函数对这个数组进行JSON格式转换


this.list=JSON.stringify(this.list)
console.log(this.list)


转换成功截图:



在转换后可以发现,正确的JSON格式最外面应该是{},所以要用replace方法把最外面的[]去掉,


const json = this.list.replace(/^\[|\]$/g, '');
        console.log(json)


成功截图:



在上述的代码截图中可以看到,已经成功去除最外层的[].


replace方法内容含义.


this.list:表示要操作的字符串。
^\[|\]$:是一个正则表达式,用于匹配字符串开头或者结尾处的方括号 [ ]。
^ 表示匹配字符串的开头位置。
\[ 表示匹配左方括号 [,由于方括号本身在正则表达式中有特殊含义,因此需要使用反斜杠 \ 进行转义。
| 表示逻辑或,即匹配左侧或右侧的表达式。
\] 表示匹配右方括号 ],同样需要使用反斜杠进行转义。
$ 表示匹配字符串的结尾位置。
/.../g:表示正则表达式使用了全局匹配,即匹配到一个符合条件的子串后不会停止,而是继续向后查找。
'':是替换字符串,表示要把匹配到的方括号替换为空字符串。


2.全部代码


编译器:hbuilder


<template>
  <view>
    <view v-for="(item,index) in list">
      {{item.courseIds}}
    </view>
  </view>
</template>
<script>
  export default {
    data() {
      return {
        list:[],
        mark:[
          {id:1,mark:2}
        ]
      }
      },
      onLoad(){
        this.list.push({
          courseIds:"123",
          mark:this.mark,
        })
        this.list=JSON.stringify(this.list)
        console.log(this.list)
        const json = this.list.replace(/^\[|\]$/g, '');
        console.log(json)
      }
  }
</script>
<style>
</style>


相关文章
|
27天前
|
JSON JavaScript 前端开发
处理从API返回的JSON数据时返回Unicode编码字符串怎么处理
在处理API返回的JSON数据时,遇到类似`\u7f51\u7edc\u8fde\u63a5\u9519\u8bef`的Unicode编码字符串,可使用JavaScript内置方法转换为可读文字。主要方法包括:1. 使用`JSON.parse`自动解析;2. 使用`decodeURIComponent`和`escape`组合解码;3. 在API调用中直接处理响应数据。这些方法能有效处理多语言内容,确保正确显示非ASCII字符。
|
7月前
|
JSON JavaScript 前端开发
JavaScript实现字符串转json对象的方法
JavaScript实现字符串转json对象的方法
|
6月前
|
XML JSON 前端开发
json字符串CSS格式化
完成以上步骤后,你便能在网页中看到格式化后的JSON数据,它们将按照CSS定义的样式进行展示,使数据更易于阅读和理解。通过有效地结合JSON和CSS,你可以创建出更加丰富且易于交互的网页内容。
251 64
|
5月前
|
JSON 前端开发 JavaScript
json字符串如何转为list对象?
json字符串如何转为list对象?
741 7
|
7月前
|
移动开发 JavaScript 前端开发
UniApp H5 跨域代理配置并使用(配置manifest.json、vue.config.js)
这篇文章介绍了在UniApp H5项目中处理跨域问题的两种方法:通过修改manifest.json文件配置h5设置,或在项目根目录创建vue.config.js文件进行代理配置,并提供了具体的配置代码示例。
UniApp H5 跨域代理配置并使用(配置manifest.json、vue.config.js)
|
6月前
|
XML JSON 前端开发
json字符串CSS格式化
json字符串CSS格式化
111 5
|
6月前
|
JSON 数据格式 Python
6-1|Python如何将json转化为字符串写到文件内 还保留json格式
6-1|Python如何将json转化为字符串写到文件内 还保留json格式
|
7月前
|
JSON Java 数据格式
Java系列之:生成JSON字符串
这篇文章介绍了两种在Java中生成JSON字符串的方法:使用`JSONObject`类及其`toJSONString`方法来动态生成,以及手动拼接字符串的方式来创建JSON格式的字符串。
Java系列之:生成JSON字符串
|
7月前
|
JSON 前端开发 JavaScript
php中JSON或数组到formData的键值对转换
转换JSON或数组到formData格式的键值对并不复杂。PHP的 `json_decode()`与 `http_build_query()`是实现这一转换过程的关键函数。理解这个转换过程对于开发中处理各种AJAX请求时调整数据格式至关重要。这样,无论是处理来自客户端的JSON字符串,还是服务器端的数组数据,都能够灵活地转换为适合网络传输的格式,确保数据交换的顺畅和高效。
152 4
|
7月前
|
JSON Go 数据格式
Go实现json字符串与各类struct相互转换
文章通过Go语言示例代码详细演示了如何实现JSON字符串与各类struct之间的相互转换,包括结构体对象生成JSON字符串和JSON字符串映射到struct对象的过程。
70 0

热门文章

最新文章