vue 判断字符串是否为json格式,json字符串格式化

判断字符串是否为json格式和格式化我写在一起了
js代码:

aaa(){
	//判断字符串是否为json格式
	try{
		var obj = JSON.parse(this.jsonString)
		if(typeof obj == 'object' && obj){
			//对字符串进行格式化展示
			var nbsp = "    "
			var num = 0
			var jsonend = ""
			var array = this.jsonString.split('')
			for(var i = 0; i < array.length; i++){
				if(array[i] === '{'){
					num = num + 1
					jsonend = jsonend + array[i] + '<br/>'
					var temp = num
					while(temp > 0){
						jsonend = jsonend + nbsp
						temp = temp - 1
					}
				}else if(array[i] === '}'){
					num = num - 1
					jsonend = jsonend + '<br/>'
					var temp = num
					while(temp > 0){
						jsonend = jsonend + nbsp
						temp = temp - 1
					}
					jsonend = jsonend + array[i]
				}else if(array[i] === '['){
					num = num + 1
					jsonend = jsonend + array[i] + '<br/>'
					var temp = num
					while(temp > 0){
						jsonend = jsonend + nbsp
						temp = temp - 1
					}
				}else if(array[i] === ']'){
					num = num - 1
					jsonend = jsonend + '<br/>'
					var temp = num
					while(temp > 0){
						jsonend = jsonend + nbsp
						temp = temp - 1
					}
					jsonend = jsonend + array[i]
				}else if(array[i] === ','){
					jsonend = jsonend + array[i] + '<br/>'
					var temp = num
					while(temp > 0){
						jsonend = jsonend + nbsp
						temp = temp - 1
					}
				}else{
					jsonend = jsonend + array[i]
				}
			}
			//格式化完成,写入到页面
			document.getElementById("qwer").innerHTML = jsonend
		}else{
			document.getElementById("qwer").innerHTML = "格式错误"
		}
	}catch(error){
		document.getElementById("qwer").innerHTML = "格式错误"
	}
}

vue代码:

<el-button type="primary" @click="aaa">aaa</el-button><!--绑定js方法-->
<el-card class="box-card">
  <div slot="header" class="clearfix">
    <span>格式化后</span>
  </div>
  <div id="qwer"></div><!--id要和js中document.getElementById里的id一致-->
</el-card>

效果图:
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值