自定义配置json显示信息

近期遇到一个需求, 就是根据后台传过来的json, 配置需要显示的字段。

github地址

GitHub - wzhGitH/tree-key: 根据后台传过来的json, 配置需要显示的字段

比如下图:  我要显示的只有 result.data.com 和 result.data.blob.content.text;

 需求是

  要求后台传过来json是根据版本可变的(就是每个版本的json都不一样),根据json选取需要显示的字段。

现在做了个demo, 选择 对应的key

  一、首先先处理json, 然后将数据处理成list模式

  

   

        二、将list处理成树形菜单结构

  

   

   三、随便先写个树形菜单显示一下

  

   

  然后通过vuex 保存选择的key信息;

  key信息 都能获取到,再加个input 输入这个key要显示的名称啥的, 最后就是提交这些内容给后台, 后台保存即可。

  // ============================  分割线 ============================ //

  这边测试一下

  假如我们保存了这两个key的信息

  

     

  我们通过遍历这个 保存的list, 去获取key的 取值路径keyStr (result.data.com这样的)

  然后去json里面拿对应的 值, 把它保存到 对应的value 里面;

  

   

   完成!!!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值