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>


相关文章
|
1月前
|
存储 JSON 前端开发
JSON数组的概念、语法和用法
JSON数组的概念、语法和用法
58 3
|
2月前
|
JSON JavaScript 前端开发
前端 ex2json 用于 vue/react/js 将 xls、xlsx、csv 文件转成 json 数组
前端 ex2json 用于 vue/react/js 将 xls、xlsx、csv 文件转成 json 数组
79 0
|
2月前
|
JSON JavaScript 数据格式
JS 将 json 对象转成字符串并保留格式 - JSON.stringify()
JS 将 json 对象转成字符串并保留格式 - JSON.stringify()
43 0
|
25天前
|
JSON PHP 数据格式
php 删掉空的数组 json数据. 空数据(false 0 ““ null)
php 删掉空的数组 json数据. 空数据(false 0 ““ null)
php 删掉空的数组 json数据. 空数据(false 0 ““ null)
|
30天前
|
JSON JavaScript Android开发
JS生成JSON字符串---autojs pro 篇
JS生成JSON字符串---autojs pro 篇
8 0
|
1月前
|
XML JSON 前端开发
教你怎么用ajax传数组(也可以是转为json)
教你怎么用ajax传数组(也可以是转为json)
18 0
|
1月前
|
JSON 前端开发 JavaScript
将 JavaScript 对象或值转换为 JSON 字符串:JSON.stringify()
将 JavaScript 对象或值转换为 JSON 字符串:JSON.stringify()
59 3
|
2月前
|
JSON 数据格式
gson自定义Type解析json数组字符串
gson自定义Type解析json数组字符串
|
2月前
|
SQL JSON 关系型数据库
【SQL编程】MySQL 5.7.28 版本使用 SQL 直接解析 JSON 字符串(判断是否是合法JSON类型+文本深度+文本长度+值类型+keys获取+值获取+不同深度数据获取)
【SQL编程】MySQL 5.7.28 版本使用 SQL 直接解析 JSON 字符串(判断是否是合法JSON类型+文本深度+文本长度+值类型+keys获取+值获取+不同深度数据获取)
36 0
|
2月前
|
JSON C# 数据格式
C# | 使用DataGridView展示JSON数组
你想展示一个复杂的JSON数组数据吗?但是你却不知道该如何展示它,是吗?没问题,因为本文就是为解决这个问题而生的!使用DataGridView轻松地将JSON数组数据以表格的形式呈现出来,这样你就可以更加清晰地了解和处理数据了。 让我们一起来探索如何实现吧!
32 0
C# | 使用DataGridView展示JSON数组