文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

vuejs如何实现字符串转对象

2023-06-25 12:09

关注

本篇内容主要讲解“vuejs如何实现字符串转对象”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“vuejs如何实现字符串转对象”吧!

vuejs实现字符串转对象的方法:1、从数据库表中读取原数据;2、通过“this.temporary=JSON.parse(row.selections);”方法将字符串转换成json对象即可。

vuejs如何实现字符串转对象

本文操作环境:windows7系统、vue2.9.6版,DELL G3电脑。

vuejs怎么实现字符串转对象?

vue.js对String类型转json格式及json对象转String:

在写vue项目的时候,由于数据量庞大转化格式相对比较复杂,于是就直接表单获取值按String格式存入了数据库表中,但是在编辑记录的时候,又得从数据库表中按id读取,再相对应的在页面上显示;

于是:就教大家如何在vue项目中怎么进行String格式 Json格式的相互转化:

且看数据库存放的数据格式;本文以selections字段为例;
vuejs如何实现字符串转对象
vuejs如何实现字符串转对象
接下来,我就来演示一下,String格式,json格式是如何相对转换
vue.js 部分重要演示代码附上:

editFormBuilder(row){//aa bb cc 只是在方便调试更清楚的看到从数据库表中拿的数据//从数据库表中读取原数据,注意看数据格式        console.log("aa",row.selections);                //接下来,如何解析成json型        this.temporary=JSON.parse(row.selections);//将字符串转换成json对象        this.items=this.temporary;        console.log("bb",this.items);                //注意看,又把对象转换成String型       this.flag=JSON.stringify(row.selections);//将json对象转换成字符串        this.items=this.flg;        console.log("cc",this.items);//再次转化格式!注意看      },

注意看下图!!!就会体会到JSON.parse ,JSON.stringify的魅力所在!
vuejs如何实现字符串转对象
顺便再详细介绍一下两函数的用法:【ps:详情来至菜鸟教程 跳转到菜鸟教程url】
(1)JSON.parse函数 :

作用:将json字符串转换成json对象语法:JSON. parse(text[,reviver]).参数:text  必须;一个有效的json字符串。reviver :可选。返回值:一个对象或数组。

(2)JSON.stringify()函数 :

作用:将json对象转换成json字符串。语法:JSON.stringify(value [, replacer] [, space]) 参数:value  必须;通常为对象或数组。replacer:可选,用于转换结果的函数或者数组。space :可选。向返回值 JSON 文本添加缩进、空格和换行符以使其更易于读取。 返回值:一个包含JSON文本的字符串。

到此,相信大家对“vuejs如何实现字符串转对象”有了更深的了解,不妨来实际操作一番吧!这里是编程网网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-后端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯